ブラウザの違いについて
世間には、
Google Chrome, Internet Exploer, Safari, Firefox, Operaなど
様々なブラウザがあり、
ブラウザによって少しずつ見た目に差異が出てきてしまう。
若干見た目が違ってくるのは、
各HTMLタグに対して設定されているCSSの標準値がブラウザによって異なるから。
これらを全て完全に一致させることはできないが、
なるべく同じになるように調整が必要になる。
◉どのフォントを使用するかを指定する。
「 font-family」というプロパティで設定する。
ページ全体のフォントを指定するため、
「 body 」のセレクタに追記する。
body {
font-family : sans-serif ;
}
ここでは、どのブラウザでもゴシック系のフォントになるように、
「 sans-serif」 を指定している。
◉「 font-family 」のプロパティ
フォントを自由に指定することができるが、
ページをみるユーザーのPCにインストールされていないフォントを
指定してしまうと、意図通りの表示にならない。
そのため、複数のフォントを、「,（カンマ）」で区切って
代替フォントを用意しておく。
最後に、全てのフォントがどれも当てはまらなかった場合も考慮して
「 sans-serif （ゴシック系）」を指定する。
◉CSSの書き方
body {
font-family : "ヒラギノ角ゴ ProN", "Hiragino kaku Gothic ProN", "メイリオ", "Meiryo", sans-serif ;
}
赤字部：Mac用の指定
水色字部：Windows用の指定
紫字部：フォントの系統
◉フォントの系統
font-familyプロパティに指定できるフォントの系統と代表的な日本語フォント
【Windowsの場合】
● serif 明朝系 ・・・・MSP明朝
● sans-serif ゴシック系 ・・メイリオ、MSPゴシック
● monospace 等幅 ・・・・・MS ゴシック
● fantasy 装飾
【Macの場合】
● serif 明朝系 ・・・・ヒラギノ明朝ProN、ヒラギノ明朝Pro
● sans-serif ゴシック系 ・・ヒラギノ角ゴProN、ヒラギノ明朝Pro
● monospace 等幅 ・・・・・Osaka
● fantasy 装飾
