teratail header banner
teratail header banner
質問するログイン新規登録

回答編集履歴

1

HTML修正

2016/09/29 04:56

投稿

yambejp
yambejp

スコア117912

answer CHANGED
@@ -1,6 +1,9 @@
1
+ #修正
1
- とえばこんな感じでしょうか?
2
+ 提示されHTMLに合わせます
3
+
4
+ CSS修正
2
5
  ```css
3
- div.selected{background-Color:aqua;}
6
+ span.selected{background-Color:aqua;}
4
7
 
5
8
  ```
6
9
  ```javascript
@@ -16,12 +19,26 @@
16
19
  }).change();
17
20
  });
18
21
 
22
+ ```
23
+ ※HTML修正
19
24
  ```HTML
25
+ <main>
26
+ <input type="checkbox" value="チェックボックス1" id="check1"/>
27
+ <label for="check1"> チェックボックス1
28
+ </label>
29
+ <input type="checkbox" value="チェックボックス2" id="check2"/>
30
+ <label for="check2">チェックボックス2</label>
31
+ <input type="checkbox" value="チェックボックス3" id="check3"/>
32
+ <label for="check3">チェックボックス3</label>
33
+ ...
34
+ </main>
35
+ <aside>
36
+ <ul>
37
+ <li><span class="icon" id="icon1">アイコン</span></li>
38
+ <li><span class="icon" id="icon2">アイコン</span></li>
39
+ <li><span class="icon" id="icon3">アイコン</span></li>
40
+ ...
41
+ </ul>
42
+ </aside>
43
+
20
44
  ```
21
- <input type="checkbox" id="check1" checked><div id="icon1">1</div>
22
- <input type="checkbox" id="check2"><div id="icon2">2</div>
23
- <input type="checkbox" id="check3"><div id="icon3">3</div>
24
- <input type="checkbox" id="check19"><div id="icon19">19</div>
25
- <input type="checkbox" id="check20"><div id="icon20">20</div>
26
-
27
- ```