回答編集履歴
2
修正
answer
CHANGED
@@ -29,7 +29,8 @@
|
|
29
29
|
今回関係するのは「~」ですね。
|
30
30
|
|
31
31
|
こういうときにドキュメントを確認します。
|
32
|
-
> [一般兄弟結合子](https://developer.mozilla.org/ja/docs/Web/CSS/General_sibling_combinator)
|
32
|
+
> [MDN:CSS: カスケーディングスタイルシート > 一般兄弟結合子](https://developer.mozilla.org/ja/docs/Web/CSS/General_sibling_combinator)
|
33
|
+
右側のセレクタで選択される要素のうち、次の条件をともにみたすものを選択します。
|
33
34
|
右側のセレクタで選択される要素が、**左側のセレクタで選択される要素より後に表れること**です。(直後である必要はありません)
|
34
35
|
もうひとつが、**これらの要素が同じ親要素(要素)をもつこと**です。
|
35
36
|
|
1
修正
answer
CHANGED
@@ -1,6 +1,3 @@
|
|
1
|
-
**※いったん途中で投稿しています。**
|
2
|
-
|
3
|
-
|
4
1
|
もっと分かりやすい指定をすると良いかと思います。
|
5
2
|
例えば背景色
|
6
3
|
```css
|
@@ -26,4 +23,17 @@
|
|
26
23
|
height:200px;
|
27
24
|
}
|
28
25
|
|
29
|
-
```
|
26
|
+
```
|
27
|
+
|
28
|
+
となると指定の仕方であることが分かると思います。
|
29
|
+
今回関係するのは「~」ですね。
|
30
|
+
|
31
|
+
こういうときにドキュメントを確認します。
|
32
|
+
> [一般兄弟結合子](https://developer.mozilla.org/ja/docs/Web/CSS/General_sibling_combinator)右側のセレクタで選択される要素のうち、次の条件をともにみたすものを選択します。
|
33
|
+
右側のセレクタで選択される要素が、**左側のセレクタで選択される要素より後に表れること**です。(直後である必要はありません)
|
34
|
+
もうひとつが、**これらの要素が同じ親要素(要素)をもつこと**です。
|
35
|
+
|
36
|
+
今のHTML構造だとinputの親はpでbuttonの親はspanです。
|
37
|
+
|
38
|
+
家系図で言うと、inputの親の兄弟の孫がbuttonなので、連結しようがない、ということになります。
|
39
|
+
HTMLの構造変えるか、JavaScriptをなんとか使うしかないのではないでしょうか。
|