こんにちはゲストさん。会員登録(無料)して質問・回答してみよう!

締切り済みの質問

見出しの装飾についての質問です。

WPで見出しの装飾をしたいのですが、うまくいきません

手順としては
(1)子テーマに、CSSを追加(クラス)
(2)本文をテキストモードで編集

詳細
(1)
外観⇒テーマの辺州
Simplicity2 child: スタイルシート (style.css) を表示


@charset "UTF-8";

/*!
Theme Name: Simplicity2 child
Template: simplicity2
Version: 20161002
*/

/* Simplicity子テーマ用のスタイルを書く */

とあるので、最後の /* Simplicity子テーマ用のスタイルを書く */
の下に、見出し装飾タグの

headline {
background: #dfefff;
box-shadow: 0px 0px 0px 5px #dfefff;
border: dashed 1px #96c2fe;
padding: 0.2em 0.5em;
color: #454545;
}

を追加し、更新

(2)
本文の見出し(h2)を修正
<h2>見出し</h2>

<h2 class="headline">見出しタイトル</h2>
に変更

更新

どこがいけないのでしょうか・・・

投稿日時 - 2018-03-07 16:31:56

QNo.9445365

困ってます

このQ&Aは役に立ちましたか?

0人が「このQ&Aが役に立った」と投票しています

回答(1)

ANo.1

ちゃんと確認したわけではないため、ちょっと自信はありませんが……。

headline {
}

.headline {
}

に修正してください。CSSでクラス名を指定するには、クラス名の前に《.》が必要です。《headline》の前に《.》を書き足してください。

うっかり忘れやすく、しかも書き忘れに気づきにくい部分でもあるため、注意が必要です。

参考URL:http://www.htmq.com/selector/class.shtml

投稿日時 - 2018-03-07 22:15:56

補足

スタイルシートのほうを
headline {   }
 ↓
.headline {   }

に変更し、そのうえで記事のほうを

<h2 class="headline">見出し</h2>

に変更してみたのですが、相変わらずでした・・・

投稿日時 - 2018-03-09 16:01:18

お礼

回答ありがとうございました。

紹介してくださった、サイト、とってもわかりやすいですね。

投稿日時 - 2018-03-09 16:01:22