Cssについてご教示いただけたら嬉しいです

日本語 ディスカッション 技術的なQ＆A
,

Topic summary

・Studioテーマでサイト構築中のCSS理解が難しく、特にbase.cssの「.section + .section」の意味が分からないため、学習リソースの紹介を要望。
・回答者がMDNの日本語ドキュメント（CSSセレクタ、CSS全般）を提示。公式解説を参照するよう案内。
・技術説明：隣接兄弟セレクタ「A + B」は、要素Aの直後に続く要素Bを選択する記法。「.section + .section」は、.sectionの直後に隣接する別の.section（後者）のみを対象にする指定。
・質問者はclass名「section」を自身のサイトで使っていたため混乱していたが、説明で理解が進み、MDNで学習を進める方針。議論は解決方向。コード例が理解の中心。

Summarized with AI on February 6. AI used: gpt-5.
1

いつもお世話になっております。
Studioのテーマでサイト構築をしています。
そこで質問なのですが、ここで使用されているCSSが難しいと感じています。
例えば、base.cssの267行目にある、

.section + .section

など。
結構CSSを修正したいと思っていますので、
どういう書物あるいはサイトで学習するべきなのか、
ご教示いただきたく、お願いいたします。

2

CSSセレクタについて、ということでしたら、下記はいかがでしょうか？

https://developer.mozilla.org/ja/docs/Web/CSS/CSS_Selectors

.section + .section

であれば、下記のように説明されています。

構文: A + B
例: h2 + p は ##  要素の後にすぐに続く 

 要素をすべて選択します。

CSSについて包括的な情報がほしいということでしたら、

同じサイトですが、

https://developer.mozilla.org/ja/docs/Web/CSS

こちらから探されると良いかと思います。

ご参考まで。

(キュー田辺)

2 Likes
3

@Qcoltd さま

ありがとうございます。
では、

.section + .section

の場合は、

section

というclassが重なった時の指定ということですね。
sectionをclass指定に使っているので、混乱しました。

ありがとうございます。ご紹介いただいたサイトで勉強します。

1 Like