ホームページ作成支援Ran.comX
 

簡単そうごリンク
■フォントについての指定

1.フォントを指定

font-family : ★;  (★はフォント名・キーワード)


               serif        (明朝系のフォント)
               sans-serif    (ゴシック系のフォント)
               cursive      (筆記体・草書体系フォント)
               fantasy      (装飾がメインのフォント)
               monospace   (等幅フォント)

フォント名     
具体的なフォント名。
名前にスペース・空白がある場合は「”」または「’」で囲む必要あり。


2.フォントサイズを指定

font-size : ★;   (★は数値+単位、%、キーワード)


               xx-small       (非常に小さい)
               x-small        (小さい)
               small         (やや小さい)
               medium       (通常・既定)
               large         (やや大きい)
               x-large        (大きい)
               xx-large       (非常に大きい)

数値+単位についてはコチラを参考にしてください。
%とは、親要素(ページで決められた基準値)に対しての割合です。
その他にも相対的なキーワードというのがあります。これは基準に対してどのぐらいかを指定するやり方です。(larger と smaller のどちらかで指定)


3.フォントの太さを指定

font-weight : ★;   (★はキーワード、数値)


                normal       (標準・既定)
                bold         (太字)
                bolder        (一段階太く)
                lighter        (一段階細く)

数値は100〜900までで、数字が大きいほど太くなり、標準は400になります。
尚、これはブラウザなどによっても見え方は異なります。


4.斜体の指定

font-style : ★;   (★はキーワード)


               italic        (斜体)
               oblique      (斜体)
               normal      (標準・既定)


5.フォントの一括指定

今までやってきたフォントの指定を一括で指定してみます。
bodyに対しての指定でやってみます。
<STYLE type="text/css">
<!--
body  {
font-family  : monospace;    /*ボディフォント*/
font-size     : 9pt;                /*ボディフォントサイズ*/
font-weight : bold;               /*ボディフォント太さ*/
font-style    : italic               /*ボディフォントスタイル*/
}
-->
</STYLE>

普通はこんな感じになっていますが、これをまとめてみます。
<STYLE type="text/css">
<!--
body  {
font : italic bold 9pt/1.8em monospace;
}
-->
</STYLE>

もちろんまとめないで、そのままわかりやすいほうが楽だという場合はそのままでも構いません。
記述の中に見慣れない「/」の部分があると思いますが、これは前のページでやったものでline-heightを書き足してあります。
line-heightを追加して指定するのはフォントサイズの後ろに「/」をつけて指定すればOKです。
指定の数値は、コチラを参考にしてください。





フォントに関しては、一番使う指定だと思います。
それと、多分スタイルシートを使用していない段階では、HTMLのフォントを指定していると思いますが、スタイルシートだといろいろな指定を一括ですることができるのが最大の利点だと言えます。
いろいろ試しながら、やってみてください。
COPYRIGHT © 2004-2007 FREEMETHOD ALL RIGHTS RESERVED. ランキングナビ