[JKDECOR]

【お使いの Snow Monkey のバージョン】19.0.0
【お使いの Snow Monkey Blocks のバージョン】18.0.0
【お使いの Snow Monkey Editor のバージョン】9.1.1
【お使いのブラウザ】safari
【当該サイトのURL】https://livingskape.jkdecor.com

### 実現したいこと

アップデート後、
H2のタイトルがかなり大きくなってしまいました。
文字サイズを以前くらいに小さくしたいです。
ご確認のほど、よろしくお願いします。

♥ 0

いいねをした人: 居ません

[キタジマ タカシ]

スマホのときですかね？

♥ 0

いいねをした人: 居ません

[JKDECOR]

あ！すいません！

そうです！スマホの時になります！

♥ 0

いいねをした人: 居ません

[キタジマ タカシ]

Snow Monkey は画面サイズが 640px 未満をスマホサイズと定義しているのでそれを指定するのと、ページ直下は .p-entry-content なので、下記のような CSS で調整できます。

@media (max-width: 639px) {
    .p-entry-content > h2 {
        font-size: 20px;
    }
}

入れ子にすると記事直下じゃなくなってスタイルが当たらなくなるので、必要に応じてセレクタを追加してください。

♥ 0

いいねをした人: 居ません

[JKDECOR]

ありがとうございます！

ちなみにH3の文字サイズを調整する場合は

@media (max-width: 639px) {
  .p-entry-content > h3 {
    font-size: 18px;
  }
}

で合っていますか？

以前こちらでH3のデザインを変更していただき、
以下のような追加CSSを追加しています。

/*H3のデザイン変更*/
.p-entry-content>h3,
.wp-block-group__inner-container>h3 {
  border-left: solid 4px #333;
  padding-left: 10px;
}

.p-entry-content>h2,
.wp-block-group__inner-container>h2 {
  background-color: #000;
  color: #fff;
}

これとバッティングするようなことはありますか？

♥ 0

いいねをした人: 居ません

[キタジマ タカシ]

プロパティ（上記でいえば font-size とか border-left とか）がダブってなければ大丈夫です！ ただ、いろんなところに記述が散らばっているとわかりにくくなるので、まずは h2 関連のものを並べて、次に h3 関連のものを並べて〜みたいに順番は整えたほうが後でみたときにもわかりやすいと思います。

♥ 0

いいねをした人: 居ません

[JKDECOR]

なるほど！分かりました！
教えて頂いた方法でH2とH3のサイズ調整ができました！

お忙しい中ありがとうございました！

♥ 1

いいねをした人:

[投稿者]

投稿