CSS background-colorが効いてくれない

Question

前提・実現したいこと

お世話になっています。

初心者です。
Wordpressを使っていて固定や投稿記事の背景色を変更したいのですが、うまくいきません。
style.CSSに次のコードを記述しました。
body {
background-color: #555555;
}

過去のログを検索したところ、開発ツールで追跡せよというのがあったので、htmlのbodyの部分を選択してStyleを確認してみました。
すると background-colorの行に取り消し線がひかれていました。
これについて調べてみたところ、これより優先度の高いものがあるということでした。
Styleの部分を見る限りここ以外に background-color が定義されている部分が見当たりません。

どのようにして見つけたら良いでしょうか？

発生している問題・エラーメッセージ

エラーメッセージ

該当のソースコード

ソースコード

試したこと

ここに問題に対して試したことを記載してください。

補足情報（FW/ツールのバージョンなど）

ここにより詳細な情報を記載してください。

Answer 1

ここ以外に background-color が定義されている部分が見当たりません

background-color はなくても 、background で一括指定されているとか……？

CSS の background 一括指定プロパティは、色、画像、原点と寸法、反復方法など、背景に関するすべてのスタイルプロパティを一括で設定します。

background - CSS: カスケーディングスタイルシート | MDN

---

あるいは、style 属性とか。

style グローバル属性は、要素に適用する CSS スタイル宣言を包含します。

style - HTML: HyperText Markup Language | MDN

---

CSS transition もありえるかも？

1. Transition declarations [css-transitions-1]
2. Important user agent declarations
3. Important user declarations
4. Important author declarations
5. Animation declarations [css-animations-1]
6. Normal author declarations
7. Normal user declarations
8. Normal user agent declarations

Origin and Importance | CSS Cascading and Inheritance Level 3

Comments

[m.ts10806]

!importantも関係ないんでしたっけ？可能性は色々考えられますね

[Lhankor_Mhy]

!important はもちろん効きますので、こっちにも !important がついている想定です。

[namiki]

返信ありがとうございます。
backgroundの指定に -color が含まれることは理解しています。
style属性は触っていない認識でいます。

[Lhankor_Mhy]

Chromeの開発者ツールで確認しているのですか？
それとも、Firefoxですか？

[namiki]

返信ありがとうございます。
Chromeでのみ確認しています。
初心者なので、勘違いなどがあったらすみません。

[gogoweb_ikeda]

chromeなら要素を選択してstyleタブではなくComputedタブからbackgroundを探せば現在適用されているスタイルが確認できませんか？

[Lhankor_Mhy]

Computedタブの background-color はどうなっていますか？

[Lhankor_Mhy]

かぶった。

[namiki]

たびたびすみません。
投稿する、その文章（文字）の背景色は body ではないようです。
基礎ができていなくて、すみません。

CSSでbodyの背景色をかえると画面の外側の枠の部分がかわることが確認できました。
投稿する文章の背景色をかえるには、どのセレクタを使えば良いのかがわかりません。

[Lhankor_Mhy]

その文章を右クリックして「検証」とすると、その要素を見ることができますよ。

[Lhankor_Mhy]

.entry-content かな、たぶん？

[namiki]

ありがとうございます、無事に解決できました。

Answer 2

スキンによる背景色が反映されているのではないかと思います。

新規にインストールしたWordPressにこちらからDLした親テーマCocoonをインストールし、
親テーマのstyle.cssの一番下に以下を追記してみました。

body {
background-color: #555555;
}

この時点で背景色が変更されたことを確認できました。

その後、背景色の指定を書いたまま[Cocoon設定]からいくつかのスキンを切り替えてみました。

テーマ直下のstyle.cssではなく、themes/cocoon-master/skins/それぞれのスキン名/style.cssで指定されており、こちらの方がテーマ直下のstyle.cssより後から読み込まれていることで指定が上書きされています。
背景色の指定がないスキンもあったので、その場合はご自身で指定した背景色が反映されているはずです。
(スキン側の背景色指定の所に!importantがあるため、その前に読み込まれるテーマ直下のstyle.css側に!important指定しても無駄でした。)

仮にスキンの背景色になってしまっているのが原因だとして、外観-カスタマイズ-追加CSSに下記を記入することで背景色の変更ができることを確認済みです。

body {
  background-color: #555555 !important; /* !important入れないとだめでした */
}

Comments

[namiki]

返信ありがとうございます。
わざわざ試して頂きまして、恐縮です。
私が言っている背景色とは、投稿した記事（文章を書いたら、その文字）の背景の色です。
それがいろいろ試してもかわってくれません。
スキンは　なし　にして試しても同じです。

[dit.]

記事そのものの背景色でしたか。
bodyに引っ張られてしまって早とちりしました。
解決できたようなので良かったです。

Answer 3

この提示内容だけだと「もう一歩踏み込んで探してみてください」としか言えませんし、調査の方向性は正しいので、もう少し見ていけば見つかりそうに思います。
WordPressだと使ってるテーマやプラグインにも依存するので全体的に見ていく必要があると思います。

取り消し線がある＝無効になっている
→他に有効になっているものがある、もしくは、無効となる指定がJavaScript含めてどこかにある
という可能性を疑いましょう。
!importantをつけても有効にならなかったらまた一歩進むと思います。

Comments

[namiki]

返信ありがとうございます。
返信を見る前に、試しに !important をつけてみましたが、かわりませんでした。
もう少し　いろいろ調べてみます。

Answer 4

テーマによってはカスタマイザーで設定している場合があります。

ダッシュボード
左メニュー ⇒ 外観 ⇒ カスタマイズ

で、背景色の設定があるか確認してみてはどうでしょう

Comments

[namiki]

返信ありがとうございます。
特に背景色は指定されていませんでした。
テーマは cocoon を試しているところです。

[-millmill-]

cocoonは左メニューに「cocoon設定」があるようですね
そこに色指定も入っていると思いますので
確認してはいかがでしょう
https://wp-cocoon.com/cocoon-original-settings/

[namiki]

ありがとうございます、無事に解決できました。

Answer 5

皆さま

お騒がせしました。解決できました。

mainというIDの部分の背景色が白になっていました。

#main {
background-color: #000
}

で背景色が黒になることを確認できました。

Computed が解決の糸口になりました。

ご回答くださった方々に感謝いたします。
ありがとうございました。