文字の大きさを変えてみる   no comments

Posted at 4:16 pm in

スタイルシートで文字サイズを自由に変える事が出来ます。 たとえば、h1(大見出し)などは、そのまま使うとかなり大きなサイズです。 ホームページを作成するとh1・h2・h3・p等などそれぞれ文字サイズにかなりの差があるため、レイアウトがうまくいかない事が多いです。 例えば、スタイルシートにh1のサイズを変えるコードを書いてみます。
h1{font-size:12px;}
h1を12pxで表示させるようにしました。
サイズの指定は、px以外にもありますが個人的にはpxが扱いやすく、一般的なように感じます。(勝手な意見) その他のサイズ指定 em・ex・pt・pc・in・cm・mm
ちなみに、pt・pc・in・cm・mmはどのブラウザで見ても同じ大きさに見えます。 レイアウト的には同じ大きさに見えた方が良いのですが、見る側がサイズを大きくしたい場合に変更する事ができません。 em・ex・pxの方が見る側には良いと思います。
あと、%を使う方法があります。
p{font-size:80%;}
pのサイズを80%にしました。 ちなみに80%の大きさは親要素を基準に決まります。 例えば、bodyに文字サイズを指定して、bodyにpを書いたら、bodyの文字サイズが基準になります。

文字サイズを調整することで読みやすいレイアウトの整ったページに仕上がり、 またCSSで指定する事で、すべてのページに共通したスタイルが与えられるため、WEBサイト自体に統一感がうまれます。

Written by admin on 10月 26th, 2010

Leave a Reply