※「使い方全般」に移動しておきます。「【重要】 お読みください」には投稿しないでください。
あわせて「質問ルール」や「問題解決のためのチェックリスト」もお読みになり、「投稿に記載する内容」を記載していただいた方が回答がつきやすいですよ。
×
#container{ font:メイリオ; }
e.g.
#container{ font-family:"メイリオ",Meiryo; }
調べれば出てくるはずです。
下記、引用。
http://www.htmq.com/style/font-family.shtml
｢ＭＳ ゴシック｣や｢ＭＳ 明朝｣のようにフォント名で指定します。フォント名にスペースが含まれている場合には、ダブルクォーテーション（ ” ）またはシングルクォーテーション（ ‘ ）で囲むようにしてください。
以下のコードをCSSファイルに記入してみて下さい。フォントを指定する場合（font-family）を指定します。以下のコードは（メイリオ）を主体とさせたい、プロのウェブデザイナーさんがよく使用されるコードの一例です。
body {font-family: "メイリオ",Meiryo,"ヒラギノ角ゴ Pro W3",Hiragino Kaku Gothic Pro,"ＭＳ Ｐゴシック",sans-serif;}
補足しておきます。まず、大前提にユーザーのパソコン環境は様々です。パソコンに「メイリオフォント」が入ってる人がすべてではありません。様々な環境があると言う事です。
それらを踏まえて、コードの意味を簡単に解説しておきますね。上記のコードは、パソコン・スマホに「メイリオ」が入ってる人の画面では「メイリオ」で表示、メイリオが入って無い人の画面では「ヒラギノ角ゴ Pro W3」で表示、メイリオもヒラギノも入ってない人の画面では「ＭＳ Ｐゴシック」で表示する。っていうコードです。
みなさん、ほんとうにありがとうございます！涙がちょちょ切れそうです。
ちなみに、スマホ表示は、メイリオになっています。
Google Chrome、IE8だとメイリオになりません。
気がつきましたが、
Theme Settingsにタイトルフォント:Sanchez とLobster
本文フォント:ゴシック/明朝」のプルダウンがありました。
ここになんか、ヒントがあるのでしょうか。。。
EisukeAkimotoさん、
ありがとうございます！ホントにありがとうです！
#container{ font-family:”メイリオ”,Meiryo; }
を入れてみたら、
勝手に
#container{ font-family:"メイリオ",Meiryo; }
に書き換わっていました。
。。なんでなんでしょう？
neko punchさん、
body {font-family: “メイリオ”,Meiryo,”ヒラギノ角ゴ Pro W3″,Hiragino Kaku Gothic Pro,”ＭＳ Ｐゴシック”,sans-serif;}
を入れる場所、って、どこですか？お勧めの位置があったら教えてください。
bodyで検索したら、下記の二つが発見されました。
①
body {
margin: 0;
②
body {
line-height:
優先順位等あるのでしょうか？
本当にすみませんがよろしくお願いします。
勝手に
#container{ font-family:”メイリオ”,Meiryo; }
に書き換わっていました。
#container{ font-family:"メイリオ",Meiryo; }
これのことだと思うのですが、こちらは何で記述されていますか？もしくはシングルクォート、ダブルクォートを変えるなどしてみてください。
上記の件はとりあえず無視しての具体的な解決策ですが、まずは内部CSS（今回書き換えてもらった部分）の
#main, #sidebar-primary, .sidebar, #footer { font-family: ゴシック !important; }
p{ font:メイリオ; }
#container{ font-family:"メイリオ",Meiryo; }
の３行を消してください。メイリオに切り替わらない原因は、最初の行の「!important」が原因です。それ以外にも消してもらう理由は、どこでどのCSSが影響しているかとhottasaikoさんが把握しにくいかと思い、その上での手順です。
上記を消していただいた後に、style.cssの810行目（Layout付近）に新たに指定を作ってしまっては如何でしょうか。neko punchさんのコードを拝借した場合
#container {font-family: "メイリオ",Meiryo,"ヒラギノ角ゴ Pro W3",Hiragino Kaku Gothic Pro,"ＭＳ Ｐゴシック",sans-serif;}
と記述します。これでメイリオにはなるでしょう。
bodyへの指定でなかった理由として、現在style.css内のbody要素がNormalize.cssとスマホ用への記述であったためです。理解できないうちは既存のCSSを書き換えるより「自分で追記したもの」という形で分けた方がいいかもしれません。
なお、お察しの通りCSSには優先順位があります。ここでは説明しきれませんし、このように上手くいかないことの繰り返しで覚えていくものでもありますので、ご自身で参照URLを一読いただければ幸いです。
スタイルの優先順位
EisukeAkimoto様
本当にありがとうございます！
とても勉強になります。
トライアンドエラーなんですね。
エラーしても、くじけずに頑張りたいともいます。
!importantを探したのですが、その前後が同じようなものが見当たらないのです。
スタイルシート (style.css)の内容をチェックすればいいんですよね？
それとも、Theme Settings内の、Custom CSS:？
（テーマによって、テーマの管理内容が違うんですね！）
制作の仕事をしている人が、独学で勉強するのに、こういう場を使っていたことがわかりました！
また、投げかけた質問に、こうやって答えてくださる人がいること、ほんと、ありがたいし、助け合い？的な感じなんですかね？
とても、新しい世界に足を踏み入れた感じですｗ
よろしくお願いします
http://ohana-for-you.com/
今回使用したテーマを作った方からメールの返信をいただいて、今格闘中です。
また、報告します！
!importantを探したのですが、その前後が同じようなものが見当たらないのです。
取り急ぎですが…
style.cssではなく、以下の記述がされている恐らくそのtheme独自の設定項目でしょうか。問題解決のためのチェックリストにもあるように、テーマがデフォルトの状態ではそのような設定項目がWordPress自体にはないため、文章を見るだけでは判断をしかねます。
<!-- Style settings -->
<style type="text/css" media="all">
html { font-size: 14px; }
#branding { font-family: Lobster; }
#main, #sidebar-primary, .sidebar, #footer { font-family: ゴシック }
a, #footer a:hover, .entry-title a:hover { color: #ef5c57; }
a:hover, a:focus { color: #000; }
#main, #sidebar-primary, .sidebar, #footer { font-family: ゴシック !important; }
p{ font:メイリオ; }
#container{ font-family:"メイリオ",Meiryo; }
</style>
http://ohana-for-you.com/のソースコード内に含まれているものですね。
おお。メニューの文字がメイリオになってますね(｀･д･´)
記事内の文字は、Akimotoさんの言われるように、今仕様されているテーマの設定のように思いますね。仕事でよく有料の海外テーマなどをいじることがありますが、普通は「タイポグラフィ」とか「スタイリング」みたいな設定枠があって、そこでフォントとか文字のサイズとか設定出来るようになってるんですが、同じ形式のように見えます。
もし、そういった設定枠がテーマにあるならそれを削除（空白）にしちゃえばいいですけど。まったく違う要素だったら何でしょう・・・。
