回答編集履歴

1

全文

2016/10/07 12:27

投稿

yambejp
yambejp

スコア114968

test CHANGED
@@ -6,7 +6,9 @@
6
6
 
7
7
 
8
8
 
9
- ```css
9
+ ```HTML
10
+
11
+ <style>
10
12
 
11
13
  input[type=checkbox] {
12
14
 
@@ -20,4 +22,170 @@
20
22
 
21
23
  }
22
24
 
25
+ label {
26
+
27
+ display: block;
28
+
29
+ width:200px;
30
+
31
+ text-align:center;
32
+
33
+ font-weight: bold;
34
+
35
+ color: #fff;
36
+
37
+ background: #e54040;
38
+
39
+ border:1px solid #dd0000;
40
+
41
+ -webkit-border-radius:4px;
42
+
43
+ -mozborder-radius:4px;
44
+
45
+ border-radius:4px;
46
+
47
+ padding: 5px;
48
+
49
+ cursor:pointer
50
+
51
+ }
52
+
53
+ input[type=checkbox]:checked ~ table.ff {
54
+
55
+ display:block;
56
+
57
+ }
58
+
59
+ table.ff {
60
+
61
+ display:none;
62
+
63
+ }
64
+
65
+ </style>
66
+
67
+ <table>
68
+
69
+ <tr>
70
+
71
+ <td>
72
+
73
+ <input type="checkbox" id="toggle1">
74
+
75
+ <label for="toggle1">
76
+
77
+ Toggle Button1
78
+
79
+ </label>
80
+
81
+ <table class="ff">
82
+
83
+ <tr>
84
+
85
+ <td>
86
+
87
+ name1
88
+
89
+ </td>
90
+
91
+ </tr>
92
+
93
+ <tr>
94
+
95
+ <td>
96
+
97
+ access1
98
+
99
+ </td>
100
+
101
+ </tr>
102
+
103
+ </table>
104
+
105
+ </td>
106
+
107
+ </tr>
108
+
109
+ <tr>
110
+
111
+ <td>
112
+
113
+ <input type="checkbox" id="toggle2">
114
+
115
+ <label for="toggle2">
116
+
117
+ Toggle Button2
118
+
119
+ </label>
120
+
121
+ <table class="ff">
122
+
123
+ <tr>
124
+
125
+ <td>
126
+
127
+ name2
128
+
129
+ </td>
130
+
131
+ </tr>
132
+
133
+ <tr>
134
+
135
+ <td>
136
+
137
+ access2
138
+
139
+ </td>
140
+
141
+ </tr>
142
+
143
+ </table>
144
+
145
+ </td>
146
+
147
+ </tr>
148
+
149
+ <tr>
150
+
151
+ <td>
152
+
153
+ <input type="checkbox" id="toggle3">
154
+
155
+ <label for="toggle3">
156
+
157
+ Toggle Button3
158
+
159
+ </label>
160
+
161
+ <table class="ff">
162
+
163
+ <tr>
164
+
165
+ <td>
166
+
167
+ name3
168
+
169
+ </td>
170
+
171
+ </tr>
172
+
173
+ <tr>
174
+
175
+ <td>
176
+
177
+ access3
178
+
179
+ </td>
180
+
181
+ </tr>
182
+
183
+ </table>
184
+
185
+ </td>
186
+
187
+ </tr>
188
+
189
+ </table>
190
+
23
191
  ```