FC2ホームページで大見出しのフォントを変更する方法

このQ&Aのポイント
  • <div id>で指定したCSSを使用して大見出しの文字サイズと書体を変更したいですが、正しく反映されません。
  • FC2ファイルエディタでフォントサイズを調整する方法もありますが、CSSファイルを使用して学習したいです。
  • 質問者は<div id>で名付けた要素を指定し、その中の<h1>要素のフォントサイズと書体を変更したいとしています。
回答を見る
  • ベストアンサー

FC2ホームページで大見出しのフォントを変更したい

<div id="">で名付けてcssで指定し、孫要素<h1></h1>の文字サイズと書体を変えたいのですが、何か間違えているらしく反映されません。お助け下さい。 ---css--- #id名 h1{ font-size: smaller; font-family:'メイリオ',"ヒラギノ丸ゴ Pro",sans-serif; } ---html--- <div id="id名"> <div> <h1>テスト</h1> <p>ほにゃらら</p> </div> </div> フォントサイズに関しては、正直FC2ファイルエディタで操作し、htmlの方に<span>で指定してもらえば解決するのですが、htmlとcssの勉強もかねているので、cssファイルで指定する方法についてご教授頂きたく存じます。

noname#257377
noname#257377

質問者が選んだベストアンサー

  • ベストアンサー
回答No.1

コピペして試したところ正しく反映されました。id名は半角アルファベットになっていますか? h1だけに反映させたいのであれば、 h1 {font-size:smaller;} などのほうがシンプルでいいと思います。 うまくいかない場合には、他のわかりやすい箇所のcssを変更して、それが反映されるか手順を確認するところから始めてみてはいかがでしょうか。

noname#257377
質問者

お礼

ありがとうございました。 cssファイルに書くと反応せず、htmlファイルのスタイル部分にコピペすると反応ありました。謎です…。

関連するQ&A

  • 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","MS Pゴシック",sans-serif; } h1,h2,h3,h4,h5,h6 { font-family: "meiryo","メイリオ", "Hiragino Mincho Pro","ヒラギノ明朝 Pro W3","ヒラギノ角ゴ Pro W3","MS P明朝",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","MS Pゴシック",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","MS Pゴシック",sans-serif; font-weight: normal; text-align: center; } div#article-options h3 { font-family: "meiryo","メイリオ","Arial","Hiragino Kaku Gothic Pro","ヒラギノ角ゴ Pro W3","MS Pゴシック",sans-serif; font-weight: normal; } の5箇所です。 スタイルはExtensible Gallery (プレーン) CSSを使用しております。 本文はMS Pゴシックが適応されています。 過去の質問等調べたところ文字コードの指定?@charset "utf-8";をcssの最後に追加は反映せず。 body a による全体?の指定をcssの最後に追加はやってみましたが反映せず。 普段はクローム(シークレットモード)を使用しておりますが、サイドバーなどは反映されていることよりブラウザ側の設定ではないですよね?念のため設定のフォントカスタマイズよりメイリオに変更してみましたがコレも反映せず。 IEでの表示もクロームと同様。 上記が試してみたことです。 原因、対策がお解かりの方がおられましたらご教授下さい。 また、提示情報に不足があれば追加致しますので宜しくお願い致します。

  • font-sizeが効かない

    html5でHTMLソースを記述しています。 時々、font-sizeが効かない事がありますが、どうしてかわかりますでしょうか? HTML>ーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーー <div class="mainContents"> <a href="#"><span class="r20 t30 b30 right"><戻る</span></a> <div class="clear"></div> </div> CSS>ーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーー .right { float:right; } .r20 { margin-right:20px; } .t30 { margin-top:30px; } .b30 { margin-bottom:30px; } .mainContents { width:320px; background-color:#fff; font-family:"ヒラギノ角ゴ Pro W6", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "MS Pゴシック", "MS PGothic", sans-serif; font-size:12px; } 確認ブラウザは、SafariとFireFoxです。 よろしくお願いいたします。

    • ベストアンサー
    • CSS
  • 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,'MS Pゴシック',Osaka,sans-serif; を使ってます。 サイトでは、bodyに font-family:'ヒラギノ角ゴ Pro W3','Hiragino Kaku Gothic Pro','メイリオ',Meiryo,'MS Pゴシック',Osaka,sans-serif; を使い、メニュー部(英語)には font-family: Georgia,Helvetica,Arial; を使い、小説部分では説明(感想)部分はbodyのままですが本文では font-family: 'MS Pゴシック', sans-serif; を使ってます。 フォントサイズについては、基本11pxですが本文だけ12pxにしてます。 日本語の部分はsans-serifだしいいかぁと思ってるんですが、やはり見にくいものなのでしょうか? こちらの意図としては本文だけ見やすかったらいい、と思っています。 ふと疑問に思ったことなので、暇な時に回答して頂ければ幸いです。

    • ベストアンサー
    • HTML
  • divにも同じフォントスタイルを適用したい

    現在 p { color : #222222;} p { font-family: Arial, Helvetica, sans-serif;} p{ margin: 1px 0px 1em 0px; font-size:95%; line-height:103%; } このような指定をしてあります。 しかしセンタリングなどに <div style="text-align:center;">のタグを使用するとセンタリングはされますけれど、上記CSSが反映されませんよね。 あちこちのHPを参考に色々試行錯誤をしていますけれど上手く反映されません。 div { color : #222222;} div { font-family: Arial, Helvetica, sans-serif;} 以下略 div.test 等に変えても同じです。 どこがダメなのでしょうか?

    • ベストアンサー
    • HTML
  • macのフォントにつきまして

    ホームページを作成中なのですが、フォントについて困っています。 windows用としては「メイリオ」を指定しようと思うのですが、mac用としては何を指定すればいいでしょうか?(macにはメイリオは入っていないようなので) ※「ヒラギノ角ゴ」以外で教えていただければうれしいです。 ※できれば、メイリオに近いフォントがいいと思っています。 宜しくお願いいたします。

    • ベストアンサー
    • CSS
  • スタイル切り替えでフォントサイズを変えたい

    <a href="#" onClick="document.getElementById('resize').style.fontSize='smaller';">文字サイズ小さく</a> <div id="resize">サイズを変えたい文</div> というシンプルな方法でページ内の指定部分フォントサイズを変えたいのですが、実際には <div id="resize"><p>サイズを変えたい文</p><p>サイズを変えたい文2</p><p>サイズを変えたい文3</p></div> という構造になっていて、<p>が入っていると、サイズが変更しません。 出来ればclassで変更したいのと、スタイルシートを複数用意して読み込み先を切り替えるのではないやり方が好ましいのですが、良い方法ないでしょうか。

  • ”今”ベストなフォント指定

    webサイトのフォント指定はfont-familyプロパティですが、みなさんどうやっているんでしょうか。 Macもosakaが標準だったのが、Mac OS Xになってからヒラギノになりました。 またVistaではメイリオが追加されました。 いったいどう指定するのがベスト または どう考えてフォント指定するのが良いのでしょうか? それとも指定しないほうがいい? 富士通などみてみましたが、フォント指定はしていませんでした。 このサイトですと、 font-family: Trebuchet MS, Lucida Sans Unicode, Arial, sans-serif; となっていました。 みなさん普段などのような理由でフォント指定をするorしないですか?

  • font-familyで色々指定しても全く変わりません;

    font-familyで色々指定しても全く変わりません; windowsでホームページを見るとフォントが見づらかったため ネットで読みやすいフォントを検索し、 CSSで font-family:"ヒラギノ角ゴ Pro W3","Hiragino Kaku Gothic Pro","MS Pゴシック","MS PGothic",Osaka,sans-self,Verdana,Arial,Helvetica; と指定しました。 しかし、指定しないファイルと見た目が全く同じなのですが XPには上記のフォントはプリインストールされていないのでしょうか? 上記の指定はフォントをダウンロードしている人にのみ適用されるだけなのでしょうか?

    • ベストアンサー
    • HTML
  • CSSでのフォントの種類指定

    質問させて下さい。 とある数ページにわたるWebサイトを作成しました。 完成した後で、フォントの種類を指定する必要がでてきたので CSSを以下のように入れていきました。 ・↓CSSファイルを作成 div{ font: 100% "MS Pゴシック", "Osaka", sans-serif;} ・各ページでCSSを呼び出し<body>の後ろに<div>と</body>の前に  </div>を入れ、全体をくくりました。 ほとんどのページではうまく機能したのですが、トップページだけ なぜか機能しません。。。 何かページ中にあると駄目なタグなどがあるのでしょうか。 分かりづらい質問かと思いますが、ご回答よろしくお願いします。

    • ベストアンサー
    • CSS
  • 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 Pゴシック", "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 Pゴシック", "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 Pゴシック", "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 Pゴシック", "MS PGothic", sans-serif; float: right; width: 296px; padding-right: 30px; height: 500px; }

専門家に質問してみよう