草稿集積棚 このページをアンテナに追加 RSSフィード

2005-03-08応用編:草稿(部分)

見出しを変えてみよう 見出しを変えてみよう - 草稿集積棚 を含むブックマーク はてなブックマーク - 見出しを変えてみよう - 草稿集積棚 見出しを変えてみよう - 草稿集積棚 のブックマークコメント

はてなダイアリーでは、見出しにはh2(日付ごとのタイトル部分)、h3(各記事のタイトル部分)、h4、h5(各記事の小見出し)を使用しています。それぞれの見栄えを変えてみましょう。

見出しを装飾してみよう

見栄えの変え方は背景の時と一緒ですが、bodyの代わりにh2〜h5のいずれかに対して指定するので、

h2 { プロパティ : 値 ; }

のような書き方になります。

複数の見出しに同じ指定をしたい時は、

h2, h3 { プロパティ : 値 ; }

のようにカンマ(,)で区切って記入します。

文字の大きさを変えてみよう

文字の大きさを変えるには、font-sizeプロパティを使用します。例えば、

h2 { font-size: 150%; }

のように書くと、h2の文字は本文の大きさに対して150%のサイズで表示されるようになります。

font-sizeに使用できる単位

font-sizeの値は、パーセンテージの他、単位による指定、親要素*1に対するサイズ指定が可能です。

(ここで各表記の説明)

枠線を引いてみよう

余白には「内側の余白」と「外側の余白」がある

文字の表示位置を変えてみよう

太字にするには、太字をやめるには

そのほかの装飾

引用、リストなども同じように装飾できる

*1:ここに「親要素」の解説