Website Tools

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のバージョンなどによって変わってくる変わってくるかもしれない。

ArialSample text
Arial BlackSample text
ImpactSample text
Trebuchet MSSample text
Times New RomanSample text
GeorgiaSample text
VerdanaSample text
Andale MonoSample text
Courier NewSample text
Comic Sans MSSample 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




Top page


よく使う特殊文字

文字スタイル

ロゴジェネレーター一覧

フォントの指定

文字コード、言語コード

文字数カウント

正規表現のテスト



Website Tools