モバイルの見出しタグの文字サイズ

PR 2018/5/13

このトピックには4件の返信、1人の参加者があり、最後にふくまいにより8年、 4ヶ月前に更新されました。

4件の返信スレッドを表示中

投稿者

投稿
- 2018年5月13日 3:21 PM #59963
  
  ふくまい
  ゲスト
  
  お世話になっております。
  
  見出しタグの文字サイズ（※article h2 h3 h4）ですが、PCで見るとサイズが”h2は26px”で、”h3は23px”で、”h4は20px”になっているようですが、モバイルだとh2もh3もh4も同じサイズになっています。
  
  もう3年simplicityさんで運営してきましたが、モバイルのh3の文字サイズが大きいなと思って変更しようとして気がつきました。
  
  今、子テーマ側でサイズの指定はしていません。
  
  念のためサイトURLをお伝えしておきます。
  https://guam-bu.com
  
  すみませんが、よろしくお願いいたします。
- 2018年5月13日 3:32 PM #59964
  
  ふくまい
  ゲスト
  
  質問者です。肝心の質問を書いていませんでした。
  
  文字サイズが変更されないので、mobile.cssやresponsive.cssなどに書いてみたり
  色々試してみたのですが、うまく反映されませんでした。
  キャッシュも消しています。
  
  そもそも何か勘違いをしているのでしょうか・・。
  
  お手数をおかけしますがご教授頂きたく。
  よろしくお願いいたします。
- 2018年5月13日 7:00 PM #59967
  Akira
  ゲスト
  子テーマの syle.css に、下記の CSS を追加すると変更できます。
```
@media screen and (max-width: 639px) {
  .article h3 {
    font-size: 18px;
  }
  .article h4 {
    font-size: 16px;
  }
}
```
- 2018年5月13日 7:12 PM #59969
  Akira
  ゲスト
  子テーマの javascript.js に追加されている jQuery が読み込まれずエラーが出ています。
  
  原因は $ を使われているため。 WordPress では、 $ をそのまま使えません。
  
  下記のように書き換えた後、デベロッパーツールでエラーが出ていないかをご確認されるといいように思えます。
```
jQuery(document).ready( function($) {
    $('#tabs li a').click( function(e) {
        $('#tabs li, #content .current').removeClass('current').removeClass('fadeInLeft');
        $(this).parent().addClass('current');
        var currentTab = $(this).attr('href');
        $(currentTab).addClass('current fadeInLeft');
        e.preventDefault();
    });
});
```
- 2018年5月13日 8:37 PM #59972
  
  ふくまい
  ゲスト
  
  早速のご回答ありがとうございます。
  サイズ変更できました。
  
  また、エラーまでご指摘いただきありがとうございます。
  色々試していた時のものが残っていました。
  （ほったらかしにしていただけ・・・）
  
  エラーも消えました。
  また何かありましたら相談させて頂きたいと思います。
  
  この度はありがとうございました。
投稿者

投稿