[新着] Webテンプレートを仮オープンしました
font-size は、文字の大きさを指定するプロパティです。
input、textarea、select要素にこのスタイルを設定すると、フォームの入力欄やボタン、セレクトボックスなどの文字サイズを指定できます。
input, select, textarea {
font-size: 80%;
}
| font-size | 文字の大きさを指定します |
|---|
【サイズの指定方法】
■数値+単位（em、pt、他）か %（割合）で指定
font-size: 80%;
12pt や 1.5em など、数値と単位で指定する方法です。
※単位については、長さの単位をご覧ください。
■7段階で指定
font-size: small;
（小）xx-small、x-small、small、medium、large、x-large、xx-large（大）
xx-small が一番小さいサイズ、xx-large が一番大きいサイズになります。デフォルトは medium です。
※ブラウザと表示モードによっては、デフォルトのサイズが small になる場合があります。詳しくは「表示モードによる解釈の違い」のフォントサイズの項目をご覧ください。
■相対的に指定
font-size: smaller;
larger … 大きめの文字
smaller … 小さめの文字
それまでの文字サイズと比較して、やや大きめ、やや小さめを指定します。
文字サイズがあまりに小さすぎると、閲覧する人の状況（視力）によっては非常に読みづらいページとなってしまいます。また、サイズを指定する際には、相対的な指定（%やemなど）にしておくことをお勧めします。
<html>
<head>
<title>TAG index Webサイト</title>
<style type="text/css">
<!--
#example { width: 300px; }
select { width: 250px; }
textarea {
width: 300px;
height: 7em;
}
input, select, textarea {
font-size: 200%;
}
-->
</style>
</head>
<body>
<form method="POST" action="example.cgi">
<p><input type="text" name="demo1" id="example"></p>
<p><select name="demo2">
<option value="HP作成1">HP作成1</option>
<option value="HP作成2">HP作成2</option>
<option value="HP作成3">HP作成3</option>
</select></p>
<p><textarea name="demo3" cols="50" rows="7"></textarea></p>
<p><input type="submit" value="送信"></p>
</form>
</body>
</html>
▼これをブラウザで見ると次のように表示されます
※サンプルのため送信できません
