Twenty Eleven子テーマのCSSが反映されない

kokumei1441
(@kokumei1441)

9年、 8ヶ月前
お世話になります。
ワードプレスを利用してのブログ運営3か月程度の初心者です。
表題の件、どうしても自分で解決できない為、ご助言願います。

こちらのフォーラム内とワードプレスコムのフォーラムにて同様の質問を検索かけましたが合致するものがなく投稿した次第です。

【環境】
編集ブラウザ：google chrome
確認ブラウザ：IE
レンタルサーバー：ロリポップサーバー
WPver3.9.2
テーマTwenty Eleven

【対象子テーマCSSコード】
フォーラムルールに則り、ペーストビンへのリンク貼ります
http://pastebin.com/PVANa4km

【質問内容詳細】
親テーマTwenty Elevenと同じ階層に子テーマTwenty Eleven-childを設け、style.cssを作成

@import url('../twentyeleven/style.css');
のコード以降に上書きしたい箇所のコードを入力しています。

記事本文のフォント変更は成功しておりますが、それ以降の

・見出しタグ<h2>の初期スタイルのリセット
・同じく見出しタグ<h2>の新しいスタイルの記述
・（プラグインTablePressで作成した）テーブルへの縦線の挿入
・記事タイトルフォント変更

現状4点の上書きが反映されずに困っています。

【確認済事項】
chromeのキャッシュクリアしています。

実際にブログ記事ページを（IEにて）開きソースを表示、style.cssの読み込みが子テーマから行われていることを確認しています。
```
<link rel="stylesheet" type="text/css" media="all" href="http://***.lolipop.jp/wp-content/themes/twentyeleven-child/style.css" />
```
以上になります。
自己解決にあたり様々なサイトやブログを参考しましたが、なぜ部分的に反映がされないのか不明です。

ご助言宜しくお願いします。

4件の返信を表示中 - 1 - 4件目 (全4件中)

nobita
(@nobita)

9年、 8ヶ月前

こんにちは、

CSSの詳細度により、スタイルが適用されていないという事になります。

h2　要素のスタイルは、投稿タイトル等のスタイルだと思いますが、投稿タイトルとした場合

親テーマのスタイル指定では、要素でなく、クラス属性の　.entry-titleでスタイル指定されているため、スタイルルールの出現位置は、後方にあっても、詳細度の高いルールが適用されているという事だと思います。、

トピック投稿者 kokumei1441
(@kokumei1441)

9年、 8ヶ月前

nobitaさん、早速のご助言ありがとうございます。

まず、CSSの詳細度・優先度の存在について指摘いただいたことに心より感謝申し上げます。
当然とは言え、勉強不足でした。。
早速、ネットサーフィンし投稿した問題の原因について理解を深めることができました。

厚かましいことは重々承知しているのですが、もう一つ問題点解決への助言いただけないでしょうか？

助言を受けた上で、私が今抱えている問題点を解決するためには、親テーマの対象スタイルの指定を直接変える必要があると考えています。

しかしこれでは親テーマのverアップが発生した場合、上書きされてしまいます。

となれば、子テーマ上で
@import url('../twentyeleven/style.css');
にて親テーマを呼び出さず、親テーマstyle.cssを全文コピーし子テーマstyle.cssへ貼り付け、その後必要な部分へ変更を加える、（hタグクラスタの変更、表への縦線追加などなど）がベターな手段でしょうか？

ご意見、もしくはより建設的な構文組み立て方法ございましたらお教え願います。
nobita
(@nobita)

9年、 8ヶ月前
助言を受けた上で、私が今抱えている問題点を解決するためには、親テーマの対象スタイルの指定を直接変える必要があると考えています。

その必要はありません

例えば、親テーマで指定されている詳細度と、同等のスタイルルールを設定すれば、前後関係による優先度になりますので、インポートしたスタイルを上書きすることができます。
```
/*h2スタイリング-現在無効*/
.entry-title a,
.entry-title,
h2 {
 margin: 0 0 30px 0; /* 上マージン0、右マージン0、下マージン30px、左マージン0 */
 font-size: 130%; /* 文字サイズを130% */
 color: red; /* 文字色を#333333 */
 padding: 5px 10px; /* 上下パディング5ピクセル、左右パディング10px */
 }
```
基本的なことなので、しっかり学んでください
トピック投稿者 kokumei1441
(@kokumei1441)

9年、 8ヶ月前

nobitaさん、ご助言ありがとうございます。

ご指摘、ごもっともこれを機に基本から学んでいこうと思います。

例にて示していただきました
.entry-title a,
.entry-title,
を付け加えてプレビュー確認しましたが、変更は認められませんでした。

やはり基本的な知識が足りていないものと痛感しています。

この度はお時間割いていただきありがとうございました。

4件の返信を表示中 - 1 - 4件目 (全4件中)

トピック「Twenty Eleven子テーマのCSSが反映されない」には新たに返信することはできません。

トピックタグ

表示