文字の大きさを変える
文字の大きさを変えるタグは、「font-size:○○;」で、○○には文字の大きさの値(em,px,%のいずれか)が入ります。
1emは16pxに対応しています(1em=16px,2em=32px)。
Windowsに限っていえば、ブラウザの標準のフォントサイズは16pxなので、%で大きさを変えるとき、100%というのは16pxであることを表します(100%=16px,75%=12px)。
%指定は、emやpx指定にはないブラウザの表示タブから文字の大きさを変えられるメリットがありますが、ブラウザから文字の大きさを変えることはめったにないと思うのと、数値の指定しやすさを考えれば、px(ピクセル)指定を薦めます。
h1 { font-size:16px; font-size:1em; font-size:100%; }
これを使って、サンプル内のh2,h3,dt,dd,ulのフォントサイズを変えてみましょう。
@charset "shift_jis";
h2 {
font-size:16px;
}
h3 {
font-size:14px;
}
dt,dd {
font-size:13px;
}
ul {
font-size:14px;
}
ここまでの作成経過はコチラ→サンプル(ホームページ作成講座)
Lesson3~CSSを使った装飾~
- htmlの骨格を作成する
- CSS(スタイルシート)の組込み方法
- CSSの基本構造
- @規則の指定
- 文字の大きさを変える
- 文字・背景の色を変える
- 文字のスタイルと太さを変える
- 幅と高さを変える
- 間隔と枠線を指定する
- カーソルを当てたときのリンクの色
コメントor補足情報orご指摘あればをお願いします。
- << 前のページ
- 次のページ >>