*

ページデフォルトのフォントファミリーをメイリオにカスタマイズ(CSS)

公開日: : Wordpress, ウェブ制作 ,

WordPressのカスタマイズ備忘録です。今回はページ全体の基本font-family(フォントファミリー)をメイリオに設定してみました。

メイリオとは

メイリオ(Meiryo)とは和文ゴシック体フォントの一つである。メイリオはWindows Vista以降のマイクロソフト製OSに標準で搭載されておりWindows XP、Windows Server 2003までのMicrosoft Windowsにおいて利用されてきたMS UI Gothicに代わる新しいシステム用フォントとして提供されている。

http://ja.wikipedia.org/wiki/メイリオ

なぜメイリオに設定したか

メイリオでウェブページをつくると、レイアウトが崩れることがあるからです。行間の差異が大きく、コンテンツとコンテンツが重なってしまう現象が多いです。そして、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で緻密なレイアウトを施しているブログ・サイト運営者の方は、メイリオチェックは大事なので、メイリオ表示を試していない方は、一度確認してみるのもいいと思います。

横浜・神奈川県央でウェブサイト制作のご相談は「合同会社ハルクアップ」

関連記事

no image

ツイッターの「プロフィールウィジェット」の一部を再設定する

自分のサイトやブログにツイートを表示するツイッター公式ウィジェット「プロフィールウィジェット」ですが

記事を読む

no image

ツイッターからのアクセス数とRTを表示するボタンを設置する

WordPressにツイッターからのアクセス数とRTを表示するボタンを設置する方法です。いろいろあ

記事を読む

no image

メールフォーム入力途中でエラー画面に移動してしまうときの対処方法

 お問い合わせフォームやお申し込みフォーム入力の途中に、Enter(エンター)キーを押したら勝手に送

記事を読む

no image

無料・オンラインでウェブページのキャプチャー画像を作成する

ウェブページのスクリーンショットが作成できるツールはいろいろありますが、オンラインで簡単にキャプチャ

記事を読む

no image

無断で自分のサイトにリンクを張られたときの対処方法

先日、既存のウェブサイトの更新について新規問い合わせをいただき、社長さんとお会いしました。その際、「

記事を読む

no image

WordPressの投稿を自動的にツイートするプラグイン「Tweetable」

思うところあって、弊社もツイッターアカウントを取得してみました。で、ブログの更新を自動的にツイッター

記事を読む

no image

FFFTP Ver.1.97aが公開されています(2010年2月10日)

某ウィルスによるFTPパスワード漏洩が問題になっていますが、超メジャー無料FTPソフト「FFFTP」

記事を読む

no image

WP Social Bookmarking Lightで「いいね」ボタンを設置してGoogle Analyticsを使っていたら必ずしたほうがいい設定

※10月11日修正追記  facebookのいいねボタンをサイトに設置し、Googleアナリティク

記事を読む

no image

炎と薪とトングの無料素材画像

 8月29日朝から夕方まで、合同会社ハルクアップ首脳会議を行いました。場所は下の画像の神奈川県某所、

記事を読む

no image

【Tweetable】ブログ更新時の自動ツイートでタイトルが挿入されない不具合解決備忘録

WordPressのブログ新規投稿をツイッターへ自動でつぶやいてくれる「Tweetable」ですが、

記事を読む

Comment

  1. フォントを変更してみた - ひきこもり以上、ニート未満 より:

    [...] 【参考サイト様】 http://haruku-up.jp/blog/wp/meiry/ [...]

フォントを変更してみた - ひきこもり以上、ニート未満 にコメントする コメントをキャンセル

メールアドレスが公開されることはありません。 * が付いている欄は必須項目です

次のHTML タグと属性が使えます: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <strike> <strong>

postagestamp01
未使用の切手(貼付済み)を剥がさずに簡単に再利用する方法備忘録

 封筒に貼ってしまってある未使用切手を再利用する方法を郵便局で教わった

kindle_sort
Kindle の デフォルト配信先 の変更方法備忘録

コンテンツと端末の管理 端末タブ 端末名「編集」

itts
テープ起こしで知った言葉201501

今月のテープ起こし案件ではこんな言葉を知りました。ありがとうございまし

KIMG0297
日経ビジネス2014.12.01メモ

トヨタミライは補助金込みで約520万円。 企業交際費は199

itts
テープ起こしで知った言葉201412

今月のテープ起こし案件ではこんな言葉を知りました。ありがとうございまし

→もっと見る

PAGE TOP ↑