Text
よく使うフォント指定
※まぁ、だいたいこんな感じ
body{ font-family: Arial,"メイリオ",Meiryo,"ヒラギノ角ゴ Pro W3","Hiragino Kaku Gothic Pro","HiraKakuPro-W3","MS Pゴシック","MS PGothic",sans-serif;} |
スタイルシートにおける font-family の種類
※フォントが無い場合にシステムに任せるときの指定
sans-serif | ゴシック体系のフォント |
serif | 明朝体系のフォント |
monospace | 固定ピッチのフォント |
fantasy | 装飾体、花文字、ポップ文字など(絵文字やシンボルは除く) |
cursive | 筆記体系のフォント |
Windows と Mac で共通に使える欧文フォント
※将来的にOSのバージョンなどによって変わってくる変わってくるかもしれない。
Arial | Sample text |
Arial Black | Sample text |
Impact | Sample text |
Trebuchet MS | Sample text |
Times New Roman | Sample text |
Georgia | Sample text |
Verdana | Sample text |
Andale Mono | Sample text |
Courier New | Sample text |
Comic Sans MS | Sample text |
日本語フォント
Safari は日本語表記のフォントファミリー名は認識しない。Firefox はアルファベット表記は認識しない。
Windows フォントMS UI Gothic | あいうえお赤青黄色 |
'MS ゴシック',MS Gothic | あいうえお赤青黄色 |
'MS 明朝',MS Mincho | あいうえお赤青黄色 |
'MS Pゴシック',MS PGothic | あいうえお赤青黄色 |
'MS P明朝',MS PMincho | あいうえお赤青黄色 |
'メイリオ',Meiryo | あいうえお赤青黄色 |
'游ゴシック',Yu Gothic | あいうえお赤青黄色 |
'游明朝',Yu Mincho | あいうえお赤青黄色 |
Macintosh フォント
'平成角ゴシック' | あいうえお赤青黄色 |
'平成明朝' | あいうえお赤青黄色 |
'Osaka-等幅',Osaka-Mono | あいうえお赤青黄色 |
Osaka | あいうえお赤青黄色 |
'ヒラギノ角ゴ Pro W3',Hiragino Kaku Gothic Pro | あいうえお赤青黄色 |
'ヒラギノ角ゴ ProN W3',Hiragino Kaku Gothic ProN | あいうえお赤青黄色 |
'ヒラギノ角ゴ Pro W6',HiraKakuPro-W6 | あいうえお赤青黄色 |
'ヒラギノ角ゴ ProN W6',HiraKakuProN-W6 | あいうえお赤青黄色 |
'ヒラギノ角ゴ Std W8',Hiragino Kaku Gothic Std | あいうえお赤青黄色 |
'ヒラギノ角ゴ StdN W8',Hiragino Kaku Gothic StdN | あいうえお赤青黄色 |
'ヒラギノ丸ゴ Pro W4',Hiragino Maru Gothic Pro | あいうえお赤青黄色 |
'ヒラギノ丸ゴ ProN W4',Hiragino Maru Gothic ProN | あいうえお赤青黄色 |
'ヒラギノ明朝 Pro W3',Hiragino Mincho Pro | あいうえお赤青黄色 |
'ヒラギノ明朝 ProN W3',Hiragino Mincho ProN | あいうえお赤青黄色 |
'ヒラギノ明朝 Pro W6',HiraMinPro-W6 | あいうえお赤青黄色 |
'ヒラギノ明朝 ProN W6',HiraMinProN-W6 | あいうえお赤青黄色 |
'游ゴシック体',YuGothic | あいうえお赤青黄色 |
'游明朝体',YuMincho | あいうえお赤青黄色 |
Webフォント
フォントデータを、ページと一緒にダウンロードして利用する仕組み。
ただし、フォントデータが大きく、ダウンロードに時間がかかったりするで、不特定多数向けには利用しにくい。
↓いまのところ、実用的でないので、とりあえず Google の英語フォント
>> Google Web Fonts