ドリル式ホームページの作り方

文字の大きさを変える

ドリル式ホームページの作り方TOP  >>  Lesson3〜CSSを使った装飾〜  >>  文字の大きさを変える

文字の大きさを変える

文字の大きさを変えるタグは、「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を使った装飾〜

  1. htmlの骨格を作成する
  2. CSS(スタイルシート)の組込み方法
  3. CSSの基本構造
  4. @規則の指定
  5. 文字の大きさを変える
  6. 文字・背景の色を変える
  7. 文字のスタイルと太さを変える
  8. 幅と高さを変える
  9. 間隔と枠線を指定する
  10. カーソルを当てたときのリンクの色

CGIの設置

  1. 掲示板を設置する
  2. カウンターを設置する
  3. アクセス解析を導入する
  4. アクセスランキングを設置する

ホームページの公開

  1. ドメインを取る
  2. サーバーを選ぶ
  3. ファイルをアップロード(公開)
Copyright(C) ドリル式ホームページの作り方 all right reserved.