フォントとCSS : Typography

Pocket

フォントとは同じデザインを持つ文字の組のこと(とても簡単な説明)。

同じフォントにボールド体[1]やイタリック体[2]が用意されている場合があり、
太さの違いやイタリック体などを含めて同じフォントの集まりをフォントファミリーと呼ぶ。たとえば有名なフォントファミリーArialにはボールド体やイタリック体を持っています。

[1] 文字を単に太くした太字に対してフォントの設計段階から太さを意図してデザインされたものをボールド体と呼びます。太さを何種類か用意しているフォントファミリーもある。
[2] 文字を単に傾けた斜体に対してフォントの設計段階から傾きを意図してデザインされたものをイタリック体と呼びます。それに対して単に傾けたものをオブリーク(Oblique)と呼ぶことがある。

  • abcdefg
    CSSでfont-family:arialを指定しています。
  • abcdefg
    CSSでfont-family:arial; font-weight: bold;を指定しています。
  • abcdefg
    CSSでfont-family:arial; font-style: italic;を指定しています。
  • abcdefg
    CSSでfont-family:arial; font-weight: bold; font-style: italic;を指定しています。

Arialはボールド体があるのでfont-weight: bold;を指定するとボールド体になります。同様にイタリック体があるのでfont-style: italic;を指定するとイタリック体になります。
ずっとArial BlackをArialのボールド体だと思っていました。Arial Blackは別のフォントファミリーみたいです(多分そうだと思います)。

abcdefg
font-family: ‘Arial Black’;を指定しています。

  • あいうえお
    CSSでfont-family: “MS Pゴシック”;を指定しています。
  • あいうえお
    CSSでfont-family: “MS Pゴシック”; font-weight: bold;を指定しています。
  • あいうえお
    CSSでfont-family: “MS Pゴシック”; font-style: italic;を指定しています。
  • あいうえお
    CSSでfont-family: “MS Pゴシック”; font-weight: bold; font-style: italic;を指定しています。
  • 日本語にはイタリック体はないので単なる斜体。MS Pゴシックにはボールド体はない(自身ないです)ので単なる太字。

    »CSSのfont-family:ヒラギノとMS Pゴシックとメイリオの悩ましい関係 : webデザイナーのナナメガキ
    フォントに限らずWebデザインに関する勉強になるブログです。

コメント

No comments yet.

コメントの投稿

改行と段落タグは自動で挿入されます。
メールアドレスは表示されません。

 


人気記事 はてなブックマーク

この日記のはてなブックマーク数