回答編集履歴
4
コメントを受けて追記
test
CHANGED
|
@@ -45,3 +45,25 @@
|
|
|
45
45
|
|
|
46
46
|
|
|
47
47
|
### 回答に誤りがあったため一部削除しました
|
|
48
|
+
|
|
49
|
+
|
|
50
|
+
|
|
51
|
+
### コメントを受けて追記
|
|
52
|
+
|
|
53
|
+
```HTML
|
|
54
|
+
|
|
55
|
+
<input type="checkbox" id="menu_bar01" class="accordion" />
|
|
56
|
+
|
|
57
|
+
```
|
|
58
|
+
|
|
59
|
+
↓
|
|
60
|
+
|
|
61
|
+
```HTML
|
|
62
|
+
|
|
63
|
+
<input type="radio" name="menu_bar" id="menu_bar01" class="accordion" />
|
|
64
|
+
|
|
65
|
+
```
|
|
66
|
+
|
|
67
|
+
のように変更すると、一つのアコーディオンニューだけが開いている状態になります。
|
|
68
|
+
|
|
69
|
+
ただし、一度開くと、（他のセレクタでコントロールしない限り）必ず一つは開いている状態になってしまいます。
|
3
回答に誤りがあったため一部削除
test
CHANGED
|
@@ -1,8 +1,8 @@
|
|
|
1
|
-
まず、兄弟セレクタの使い方を間違っているため、動作しません。
|
|
1
|
+
~~まず、兄弟セレクタの使い方を間違っているため、動作しません。~~
|
|
2
2
|
|
|
3
|
-
> 同じ親要素の子同士であって、1つ目の要素の後にある2つ目の要素を選択します
|
|
3
|
+
> ~~同じ親要素の子同士であって、1つ目の要素の後にある2つ目の要素を選択します
|
|
4
4
|
|
|
5
|
-
[一般兄弟結合子 - CSS: カスケーディングスタイルシート | MDN](https://developer.mozilla.org/ja/docs/Web/CSS/General_sibling_combinator)
|
|
5
|
+
[一般兄弟結合子 - CSS: カスケーディングスタイルシート | MDN](https://developer.mozilla.org/ja/docs/Web/CSS/General_sibling_combinator)~~
|
|
6
6
|
|
|
7
7
|
|
|
8
8
|
|
|
@@ -12,9 +12,9 @@
|
|
|
12
12
|
|
|
13
13
|
```
|
|
14
14
|
|
|
15
|
-
`li`の親要素は`ul`ですから、このセレクタに当てはまる要素はありません。同様の誤りが複数見られます。
|
|
15
|
+
~~`li`の親要素は`ul`ですから、このセレクタに当てはまる要素はありません。同様の誤りが複数見られます。
|
|
16
16
|
|
|
17
|
-
解決方法は、`ul`にスタイルを当ててください。
|
|
17
|
+
解決方法は、`ul`にスタイルを当ててください。~~
|
|
18
18
|
|
|
19
19
|
|
|
20
20
|
|
|
@@ -41,3 +41,7 @@
|
|
|
41
41
|
「マウスオーバーして表示非表示の操作にしたい」ですが、`label`に`id`などを持たせて`:hover`擬似クラスを使えばいいかと思います。
|
|
42
42
|
|
|
43
43
|
ただ、その場合マウスアウトすると非表示に戻ります。
|
|
44
|
+
|
|
45
|
+
|
|
46
|
+
|
|
47
|
+
### 回答に誤りがあったため一部削除しました
|
2
訂正
test
CHANGED
|
@@ -38,6 +38,6 @@
|
|
|
38
38
|
|
|
39
39
|
### 質問が追加されていたので追記
|
|
40
40
|
|
|
41
|
-
「マウスオーバーして表示非表示の操作にしたい」ですが、`label`に`id`などを持たせて`:hover`擬似
|
|
41
|
+
「マウスオーバーして表示非表示の操作にしたい」ですが、`label`に`id`などを持たせて`:hover`擬似クラスを使えばいいかと思います。
|
|
42
42
|
|
|
43
43
|
ただ、その場合マウスアウトすると非表示に戻ります。
|
1
質問が追加されていたので追記
test
CHANGED
|
@@ -33,3 +33,11 @@
|
|
|
33
33
|
|
|
34
34
|
|
|
35
35
|
最後に、「特定のメニューをクリックすると開いていたメニューが自動的に閉じる」ですが、「特定のメニュー」を`#close`とすると`#close:checked ~ ul`のようなセレクタで記述できると思いますが、その状態を保持してしまうので、メニューを再度開く際には「特定のメニュー」をもう一度クリックする必要があります。
|
|
36
|
+
|
|
37
|
+
|
|
38
|
+
|
|
39
|
+
### 質問が追加されていたので追記
|
|
40
|
+
|
|
41
|
+
「マウスオーバーして表示非表示の操作にしたい」ですが、`label`に`id`などを持たせて`:hover`擬似属性を使えばいいかと思います。
|
|
42
|
+
|
|
43
|
+
ただ、その場合マウスアウトすると非表示に戻ります。
|