ページデフォルトのフォントファミリーをメイリオにカスタマイズ(CSS)
公開日:
:
Wordpress, ウェブ制作 font, wordpress2.8.6
WordPressのカスタマイズ備忘録です。今回はページ全体の基本font-family(フォントファミリー)をメイリオに設定してみました。
メイリオとは
メイリオ(Meiryo)とは和文ゴシック体フォントの一つである。メイリオはWindows Vista以降のマイクロソフト製OSに標準で搭載されておりWindows XP、Windows Server 2003までのMicrosoft Windowsにおいて利用されてきたMS UI Gothicに代わる新しいシステム用フォントとして提供されている。
なぜメイリオに設定したか
メイリオでウェブページをつくると、レイアウトが崩れることがあるからです。行間の差異が大きく、コンテンツとコンテンツが重なってしまう現象が多いです。そして、FireFox等のブラウザではユーザー独自の表示フォントファミリーの設定が可能なので、作成側がメイリオ以外のフォントで設定しても無視されることがあるのです。逆に言うと、メイリオできちんと表示されていれば、ほかのフォントで表示設定されてもまあ何とか大丈夫、という、大は小を兼ねる(?)作戦って感じです。
wp.Vicuna Ext. Custom 1.5.9での設定
このブログはテーマに「wp.Vicuna Ext. Custom 1.5.9」を使用しています。このテーマフォルダ内の「style-vega」というフォルダ内に「core.css」というcssファイルがあります。この中の「body{ }」記述内に「font-family: “メイリオ”」云々を追記します。これで初期設定フォントはメイリオで表示されるようになりました。
サイト制作者はメイリオチェックを
ブログCMSにはあらかじめそういったレイアウト崩れを防止したプログラミングがされているかもしれないので、この作業は不要かもしれなかったのですが、念のため、というかメイリオが好きなんです(笑)。また、このブログは(今のところ)ほとんどがテキスト主体なので、ますますレイアウト崩れを気にする必要性は薄いのですが、画像満載、ブロック要素満載、CSSで緻密なレイアウトを施しているブログ・サイト運営者の方は、メイリオチェックは大事なので、メイリオ表示を試していない方は、一度確認してみるのもいいと思います。
関連記事
-
-
記事の投稿時間を非表示にするカスタマイズ
Wordpressで記事を投稿(公開)すると、自動的に投稿日時が挿入されます。投稿年月日はいいのです
-
-
wordpress2.8.6でブログを始めました。
横浜で、というより大和市や町田市に近いところでパソコンを使ったIT事務を代行する会社「合同会社ハルク
-
-
ツイッターの「プロフィールウィジェット」の一部を再設定する
自分のサイトやブログにツイートを表示するツイッター公式ウィジェット「プロフィールウィジェット」ですが
-
-
ウェブ制作者から見たIE6(インターネットエクスプローラー)と他のブラウザの違い
2010年3月4日、アメリカコロラド州でIE6の葬儀イベントが行われた。米国のAten Desig
-
-
無料・オンラインでウェブページのキャプチャー画像を作成する
ウェブページのスクリーンショットが作成できるツールはいろいろありますが、オンラインで簡単にキャプチャ
-
-
【Tweetable】ブログ更新時の自動ツイートでタイトルが挿入されない不具合解決備忘録
WordPressのブログ新規投稿をツイッターへ自動でつぶやいてくれる「Tweetable」ですが、
-
-
Google (XML) Sitemaps Generator for WordPressのエラー解決法の一
Google (XML) Sitemaps Generator for WordPress(Word
-
-
画面解像度(横幅)の適切なサイズを検証する
昔に比べて高機能なパソコンが多くなり、画面も連れて高解像度になってきています。ウェブサイト(ホームペ
-
-
WP Social Bookmarking Lightで「いいね」ボタンを設置してGoogle Analyticsを使っていたら必ずしたほうがいい設定
※10月11日修正追記 facebookのいいねボタンをサイトに設置し、Googleアナリティク
-
-
炎と薪とトングの無料素材画像
8月29日朝から夕方まで、合同会社ハルクアップ首脳会議を行いました。場所は下の画像の神奈川県某所、
- PREV
- 記事の投稿時間を非表示にするカスタマイズ
- NEXT
- テープ起こし作業時の人名表記特定
Comment
[...] 【参考サイト様】 http://haruku-up.jp/blog/wp/meiry/ [...]