- ベストアンサー
MAC/Safariでゴシック表示ができません
いつもお世話になります。 ｗｅｂサイト構築中なのですが、 できあがったサイトをwindowsのＩＥ/Safari、Forefoxで見ると ゴシックで表示されるのですが、 MacのSafariでは明朝体で表示されてしまいます。 ちなみにCSSではbodyタグに以下の記述をしています。 どこがおかしいのでしょうか？ font-family: 'ＭＳ Ｐゴシック' ,Osaka,'ヒラギノ角ゴ Pro W3', 'Times New Roman','times 16', sans-serif ; 教えてください。よろしくお願いします。
- tomoyamma
- お礼率98% (99/101)
- HTML
- 回答数2
- ありがとう数2
- みんなの回答 （2）
- 専門家の回答
質問者が選んだベストアンサー
「Safari font-family」でググルとわかるように、MacのSafariは font-familyの指定に日本語が使えないそうです。しょっぱなの 'ＭＳ Ｐゴシック'で読めずに解釈を諦めてるんでしょう。 font-family: Osaka, 'ＭＳ Ｐゴシック', Sans-Serif; ならOsakaで表示するかもしれませんし、MSOfficeの入ったMacでも 醜いMSフォントになりません。font-familyはマイナーなフォント から書くのがセオリーです。Osakaは必ずあるのでヒラギノを指定 する意味はありませんが、ヒラギノが好みなら'Hiragino Kaku Gothic Pro'のように日本語の文字を使わずに指定してください。
その他の回答 (1)
AppleのMac機でSafariを利用していると想定して回答いたします。 「ＭＳ Ｐゴシック」のフォントがMac機に無いからです。 私はMac機の使用経験がありませんので推測になりますが、font-familyで、次点とされているOsakaが明朝体なのでは？
お礼
早々のご回答ありがとうございます。 ＞「ＭＳ Ｐゴシック」のフォントがMac機に無いからです。 そうかな、と思っていたんですが・・・。 NO.2のかたの方法で解決しました。
関連するQ&A
- CSS SafariでMS P ゴシックを表示したい
SafariでMS P ゴシックを表示したいのですが、 font-family: 'ＭＳ Ｐゴシック', MS P Gothic, 'ヒラギノ角ゴ Pro W3', 'Hiragino Kaku Gothic Pro', 'メイリオ', Meiryo, sans-serif; 上記のCSSでは表示してくれません。 SafariでもMS P ゴシックを表示する方法をお願いいたします。
- ベストアンサー
- HTML
- font-familyの使い方
font-familyに正しい使い方ってあるんでしょうか？ 私、ブログとサイト（共にFC2)やってるんですけど2種類（3種類？）のfont-familyを使ってるんです。 これって閲覧者にとっては見づらいものなのでしょうか。 ブログの方では、bodyに font-family : "ヒラギノ角ゴ Pro W3","Hiragino Kaku GothicPro","Osaka","verdana","arial", sans-serif; を使い、記事の本文にだけ font-family:'ヒラギノ角ゴ Pro W3','Hiragino Kaku Gothic Pro','メイリオ',Meiryo,'ＭＳ Ｐゴシック',Osaka,sans-serif; を使ってます。 サイトでは、bodyに font-family:'ヒラギノ角ゴ Pro W3','Hiragino Kaku Gothic Pro','メイリオ',Meiryo,'ＭＳ Ｐゴシック',Osaka,sans-serif; を使い、メニュー部（英語）には font-family: Georgia,Helvetica,Arial; を使い、小説部分では説明（感想）部分はbodyのままですが本文では font-family: 'ＭＳ Ｐゴシック', sans-serif; を使ってます。 フォントサイズについては、基本11pxですが本文だけ12pxにしてます。 日本語の部分はsans-serifだしいいかぁと思ってるんですが、やはり見にくいものなのでしょうか？ こちらの意図としては本文だけ見やすかったらいい、と思っています。 ふと疑問に思ったことなので、暇な時に回答して頂ければ幸いです。
- ベストアンサー
- HTML
- 半角英数字のみベースラインが下がってしまいます
サイト制作を行っているのですが、ページ内の半角英数字のみ全角文字より若干下がって表示されます。 例えば、 あいうえお1234かきくけこabcd ですと、「1234」と「abcd」の部分が「あいうえお」「かきくけこ」に比べて若干下がってしまい、テキストリンクがついていると、ガタガタになってしまいます。 文字コードはUTF-8でフォントはCSSで font-family: "ヒラギノ角ゴ Pro W3","Hiragino Kaku GothicPro",Osaka,Verdana,Helvetica,Arial,"ＭＳ Ｐゴシック",sans-serif を指定しています。 よろしくお願いいたします！
- 締切済み
- デザイナー・クリエイティブ職
- 「メイリオ」指定のIEに「MSPゴシック」を表示？
IEの「インターネットオプション＞フォント」で「メイリオ」を指定している人がいるとします。 この人に「英字＝Arial、漢字＝MSPゴシック」を見せるためにはどのようにCSS指定すればいいでしょうか？ font-family:arial,"MS Pゴシック","MS PGothic",sans-serif; このように指定すると「英字＝Arial、漢字＝メイリオ」になってしまいます。 IEは英字フォント指定が先にあると、次の"MS Pゴシック"を無視するらしい。 font-family:"MS Pゴシック","MS PGothic",arial,sans-serif; そこでこのように指定すると当然「英字＝MSPゴシック、漢字＝MSPゴシック」になってしまいます。 どうしても英字はArialで表示したいのです。どうすればいいのでしょう。 ちなみに Firefox ではこういう面倒は起きません。 よろしくお願いします。
- 締切済み
- HTML
- CSSのフォント指定
現在bodyに以下の設定をしています。 font-family: verdana,"ヒラギノ角ゴ Pro W3","Hiragino Kaku Gothic Pro",Osaka,"ＭＳ Ｐゴシック","MS PGothic",Sans-Serif; 実際にヒラギノ角ゴ Pro W3をインストールしてサイトを見るとアンチエイリアスが 掛かっていないようで非常に文字が見づらいです。 ※環境はWinXPでIE8 上記の設定をしたのも以前に調べてみた際に定番のような指定に見受けられたので このような設定にしたのですが今の定番ってありますか？ また、こんな設定にしているなどというアドバイスもいただけます嬉しいです！ 宜しくお願いします。
- 締切済み
- HTML
- Safariのフォントについて
MAC OSX 10.4.11 Safariを使っています。 Safariを3.0.4にアップデートしたのですが それまでゴシック体（？）で見えていたフォントが 所々 明朝体（？）になってしまっている所があります。 もとのゴシック体の方が見やすいので戻したいのですが、 明朝体をゴシック体になるように変えることはできますか？ 環境設定の表示は 標準フォント Osaka14 等幅フォント Osaka14 デフォルトエンコーディング 日本語（Shift jis） になっています。こちらの設定は何か関係ありますでしょうか。 よろしくお願い致します。
- ベストアンサー
- Mac
- CSSがFirefoxで効かない（IEでは効く）
body{ font-family: "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif; } という記述をしているのですが、IE7では有効なのに、Firefox3では有効になりません。 なぜなのでしょうか？ ご存じの方いらっしゃいましたら、お教えいただけると幸いです。 よろしくお願いいたします。 ＊当方環境は、vista ultimate 64bitです
- ベストアンサー
- HTML
- floatの使い方
すごく初歩的な質問をさせて下さい。 DW5.5を使用しております。 「contents」というdivの中に「main_1」と「main_2」というdivを入れたいのですが、 floatを使用するとcontentsの下側に回ってしまいます。 「main_1」を左寄せに、「main_2」を右寄せにして「contents」内にはめるには どのようにすればよいのでしょうか？ どなたかご教授下さい。 ＜＜ソース＞＞ <body> <div id="contents"> <div class="main_1"> </div> <div class="main_2"> </div> </div> </body> ＜＜css＞＞ *{ margin:0px; padding:0px; } img{ border:none; } li{ list-style-type:none; } body{ font-size:12px; line-height:1.4em; font-family:"ＭＳ Ｐゴシック", "MS PGothic", "メイリオ", Meiryo, Osaka, "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", sans-serif; background-color: #333333; margin:0px auto; } /* FireFox リンク選択時の点線を消す */ a{ overflow:hidden; outline:none; } /* FireFox flashの境界の点線を消す */ object{ outline:none; } #contents{ width: 940px; font-family: "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif; background: #000 url(../img/con_main.png) repeat-y; padding-top: 42px; padding-left: 60px; } .main_1{ font-family: "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif; padding-left: 40px; width: 550px; float: left; height: 500px; } .main_2{ font-family: "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif; float: right; width: 296px; padding-right: 30px; height: 500px; }
- ベストアンサー
- ホームページ作成ソフト
- 和のウェブサイトのfont-family指定
和食屋さんのウェブサイトをつくろうと思っています。 文字の書体を和風にしたいのです。 現在のサイトは（前製作者かな）はCSSの指定で {font-family :"ヒラギノ明朝 Pro W3","ＭＳ 明朝";} となっています。 よっぽどこの2つがあれば大丈夫でしょうか？ 他にもし多くインストールされているフォントがあればそれも 記述したいと思います。何かありますか？ それとも、 むしろ日本語指定をはずしたほうがいいのかな？ {font-family :sans-serif;}のように。
- ベストアンサー
- CSS
- livedoorblog css フォント
cssの一部不適応についての対策を教えて下さい。 初めに申しておきますとかなりの素人です。 cssをみて、body….font….とは？どこ？と試しに変更してみてなんとかやっている状態です。 表題にあるとおりlivedoorにてblogをしており、この度ブログ内の全フォントをメイリオに変更致しましたが記事の本文のみ反映されません。 他のブログ名・記事名・サイドバー・ページ数・次へ・コメント等には反映致しました。 やったことといえばcssから”font-family”を探し出し、すべての頭にmeiryo,"メイリオ"を追加しました。 追加した部分は body { line-height: 1.3; background: #fff; color: #333333; font-size: 80%;/*サイドバー？全体？*/ font-family: meiryo,"メイリオ","Arial","Hiragino Kaku Gothic Pro","ヒラギノ角ゴ Pro W3","ＭＳ Ｐゴシック",sans-serif; } h1,h2,h3,h4,h5,h6 { font-family: "meiryo","メイリオ", "Hiragino Mincho Pro","ヒラギノ明朝 Pro W3","ヒラギノ角ゴ Pro W3","ＭＳ Ｐ明朝",serif; } div#introductionOuter h1 a:link, div#introductionOuter h1 a:active, div#introductionOuter h1 a:visited { color: #333; font-weight: normal; font-size: 100%;/*ブログタイトル*/ font-family: "meiryo","メイリオ","Arial","Hiragino Kaku Gothic Pro", "ヒラギノ角ゴ Pro W3","ＭＳ Ｐゴシック",sans-serif; text-decoration: none; } div.archiveTitleOuter h2 { margin-bottom: 50px; padding: 15px 0; border-top: dotted 1px #666; border-bottom: dotted 1px #666; font-family: "meiryo","メイリオ"," Arial","Hiragino Kaku Gothic Pro","ヒラギノ角ゴ Pro W3","ＭＳ Ｐゴシック",sans-serif; font-weight: normal; text-align: center; } div#article-options h3 { font-family: "meiryo","メイリオ","Arial","Hiragino Kaku Gothic Pro","ヒラギノ角ゴ Pro W3","ＭＳ Ｐゴシック",sans-serif; font-weight: normal; } の5箇所です。 スタイルはExtensible Gallery (プレーン) CSSを使用しております。 本文はMS Pゴシックが適応されています。 過去の質問等調べたところ文字コードの指定？@charset "utf-8";をcssの最後に追加は反映せず。 body a による全体？の指定をcssの最後に追加はやってみましたが反映せず。 普段はクローム（シークレットモード）を使用しておりますが、サイドバーなどは反映されていることよりブラウザ側の設定ではないですよね？念のため設定のフォントカスタマイズよりメイリオに変更してみましたがコレも反映せず。 IEでの表示もクロームと同様。 上記が試してみたことです。 原因、対策がお解かりの方がおられましたらご教授下さい。 また、提示情報に不足があれば追加致しますので宜しくお願い致します。
- ベストアンサー
- ブログ
お礼
早々のご回答ありがとうありがとうございます。 ゴシック表示できました！たぶんOsakaで表示できてるんだと思います。 >MacのSafariは >font-familyの指定に日本語が使えないそうです。しょっぱなの >'ＭＳ Ｐゴシック'で読めずに解釈を諦めてるんでしょう。 コレを知らずに数日間悩んでました。 本当にありがとうございます。