【前のページ←見本→次のページ】 更新日

Ⅱ-１　文字の大きさを変える

１）見出しのデザイン設定を書く場所を用意します

文字の大きさなど、コンテンツのデザインに関する設定は、<style >～</style>の中に書きます
このデザインを変えたいコンテンツに対して、デザインの設定を書く場所を用意します
ここでは<h1>～</h1>に書いた見出しの大きさを変えます
そこで見出しのデザインを書く場所として、「h1{　}」を追加します
<html>
<head>
<title>色探しの旅</title>
<style type="text/css"><!--

h1{font-size:25px}

--></style>
</head>
<body>

<h1>色探しの旅『Sky&Water』</h1>

<p>日本の四季には色が満ちています。空そして水の色『色探しの旅』に出かけませんか</p>

<div>copyright(c)sora</div>
</body>
</html>

２）見出しの文字を小さくします

h1{～}の中に文字の大きさの設定を書きます。
大きさはfont-sizeで設定出来、値は「25px」と指定すれば２５ピクセルの大きさで表示されます

※文字の大きさの設定には以下の値や単位が使えます

font-sizeで設定出来る値

数値（px）ピクセル数などで指定

割合（%） 現在の文字サイズに対する割合で指定

xx-small　最極小

x-small　 極小

small　　 小

medium　　中

large　　 大

x-large　 極大

xx-large　最極大

smaller　 ひとまわり小さく

larger　　ひとまわり大きく

数値で設定するときの単位の書き方

px　　　　ピクセル

cm　　　　センチメートル

mm　　　　ミリメートル

in　　　　インチ（１in=約2.54㎝）

pt　　　　ポイント

pc　　　　パイカ（1pc=12pt）

em　　　　1em=現在のフォントサイズ

ex　　　　1ex=現在のフォントの小文字"x"の高さ