ホーム >>> HTML整理ノート

fontの一括指定

★書式　{font:font-style font-weight font-variant font-size font-family}

・複数のfont属性を半角スペースで区切り並べる。順序は決まっている。
・font-size font-familyだけは必須。省略した属性には初期値を適用。
・font-sizeには、スラッシュ(/)を付けline-heightを付加できる(例　20px/1.3em）
・複数のfont-familyを指定する場合はカンマ(,)で区切って指定。

Sample

サンプルです

フォントサイズ２０ｐｘ、行間1.8emの
サンプルです

Script プロパティ ･･･＜font＞

下の文字にマウスを載せるとフォントが変化します。

CSS Style

Sample Source......................................................................>>>

<p style="font:italic 800 14pt 'Arial Black','ＭＳ Ｐ明朝'">サンプルです</p> 
<p style="font: 100 20px/1.8em 'ＭＳ Ｐゴシック';border:thin solid navy">
　　　　　　　フォントサイズ２０ｐｘ、行間1.8emの<br>サンプルです</p> 

<div style="width:250;height:40;color:green;font:16pt 'ＭＳ 明朝';
                  text-align:center;cursor:hand" 
  onmouseover="this.style.font='italic 20pt Arial Black';this.style.color='red';" 
  onmouseout="this.style.font='normal 16pt ＭＳ 明朝';this.style.color='green';">
 CSS Style
</div>