PC、ゲーム、デジタル機器などの初心者向けの話題や小技などをつらつらと……

スポンサーサイト

上記の広告は1ヶ月以上更新のないブログに表示されています。
新しい記事を書く事で広告が消せます。

Loading...

FC2ブログテンプレートのCSSのfont-family設定を変更する

 先日当ブログのフォント設定をメイリオ主体に変更したが、その際にCSSの【font-family】設定について色々と調べてみたので、備忘録代わりに記録しておこうかと。

 ちなみにこれまでの当ブログの【font-family】設定は

font-family:Verdana,"ヒラギノ角ゴ Pro W3","Hiragino Kaku Gothic Pro","MS Pゴシック",Osaka,sans-serif;

 だったが、これに「メイリオ」「Meiryo UI」を追加して、WindowsVista以降では「メイリオ」、Windows7以降では「Meiryo UI」が標準フォントとして適応されるように設定した。
 まず【font-family】記述の基本を調べてみると

 ■ 記述左側にあるフォントから優先して適応していく
 ■ 複数のフォントを記述する場合、記述フォント間は「,」で区切る
 ■ 英文表記フォントはそのまま記述する(Verdanaなど)
 ■ 和文表記フォントは「"」で囲む("MS Pゴシック"など)

 となる。そして今回のフォント変更の要点は、

 ■ Windows7環境では「Meiryo UI」を標準にする
 ■ WindowsVista環境では「メイリオ」を標準にする
 ■ XP以前の環境では和文は「MSP ゴシック」、欧文は「Verdana」を標準にする

 以上のようになるため、変更した記述は以下の通りになる。

font-family:Meiryo UI,Meiryo,"メイリオ",Verdana,"ヒラギノ角ゴ Pro W3","Hiragino Kaku Gothic Pro","MS Pゴシック",Osaka,sans-serif;

 これでWin7ではMeiryo UI、Vistaでは「メイリオ」、そしてXP以前では「Verdana」と「MS Pゴシック」がそれぞれ標準フォントとして表示される。
 「ヒラギノ角ゴ Pro W3」「Hiragino Kaku Gothic Pro」そして「Osaka」はメイリオやMS PゴシックフォントがインストールされていないMac環境での閲覧用フォントのため、そのまま置いておく。

 CSS内の【font-family】は本文記事やタイトル部分、プラグイン部分など、テンプレートにもよるがCSS内に複数箇所あるのが普通なので、変更したい部分を選び、それぞれに変更を加えていけば作業完了となる。



Loading...
コメント
コメントの投稿
【Font & Icon】
管理者にだけ表示を許可する
プロフィール

雪陽炎

Author:雪陽炎
 PCやデジタル機器類いじりの他にも、あれやこれやと趣味を持つ器用貧乏な奈良県民。
 初心者向け兼自身の忘備録としてPC及びデジタル機器関連の情報をまとめてます。

参加ブログランキング

にほんブログ村 PC家電ブログ パソコン・周辺機器へ にほんブログ村 PC家電ブログ 家電・AV機器へ
にほんブログ村 PC家電ブログ PCオーディオへ
人気ブログランキングへ
人気ブログランキングへ
最新記事
スポンサ-ドリンク
最新コメント
最新トラックバック
Amazon
楽天
ブロとも申請フォーム

この人とブロともになる

関連記事Loader

[猫カフェ]futaha

スポンサードリンク
本館/別館サイト
カテゴリ
ブックマーク
最近のチェックリスト / PC関連
最近のチェックリスト / AV関連
上記広告は1ヶ月以上更新のないブログに表示されています。新しい記事を書くことで広告を消せます。