2018/12/30
CSSのセレクタの書き方の問題ですね。
.entry-content h2 .webtitleというように半角スペースで要素やクラス名を区切ると、「◯◯タグの中の◯◯タグに対して」というような意味になります。
今回の場合h2タグに.webtitleが指定されているので、正しいセレクタは.entry-content h2.webtitleです。
h2と.webtitleの間に半角スペースがあると効きません。
2018/12/30
うまくできました。
本当にありがとうございます！ もっと勉強していきます。
WordPressテーマSANGOの質問
サルワカの見出しのスタイルが効かない
こんにちは。見出しについてどうしても解決できず、助けてほしいです。
サルワカさんで紹介されている以下の見出しをh2に使っているのですが、classを指定して特定の部分だけ見出しのデザインを変えることができません。divなどほかの部分では問題なくできています。
見出しでクラスを指定して変えるための方法がなにかあるのか知りたいです。
該当ページ
https://www.quest-mile.com/nenmatunensi-web-syosetu
見出し部分のHTML
1.step beat
元の見出しのHTML
/*ｈ２テーマデザイン*/
.entry-content h2{
position: relative;
color: white;
background: #15B7B9;
line-height: 1.4;
padding: 0.5em 0.5em 0.5em 1.8em;
}
.entry-content h2:before {/*疑似要素*/
font-family: “Font Awesome 5 Free”;
content: “\f14a”;
position: absolute;
left : 0.5em; /*左端からのアイコンまでの距離*/
}
変えたいデザインのHTML（ここだけmargin-bottomを０にしたい）
/*ｈ２テーマデザイン*/
（.entry-content h2 .webtitle にしても反映されません）
.webtitle{
position: relative;
color: white;
background: #15B7B9;
line-height: 1.4;
padding: 0.5em 0.5em 0.5em 1.8em;
margin-bottom: 0px;
}
.webtitle::before {/*疑似要素*/
font-family: “Font Awesome 5 Free”;
content: “\f14a”;
position: absolute;
left : 0.5em; /*左端からのアイコンまでの距離*/
}