質問編集履歴

2

2019/11/28 07:32

投稿

takumi1113
takumi1113

スコア7

test CHANGED
File without changes
test CHANGED
@@ -10,292 +10,284 @@
10
10
 
11
11
  <div class="topics-block topics-block-tab topics-block-top" tab="1">
12
12
 
13
- <div class="topics-tab-wrap">
13
+     --<div class="topics-tab-wrap">
14
-
14
+
15
- <ul id="topics-block-tab-1" class="topics-tab topics-tab-index">
15
+ ----<ul id="topics-block-tab-1" class="topics-tab topics-tab-index">
16
-
16
+
17
- <li class="topics-tab-1 topics-tab-selected">
17
+ ------<li class="topics-tab-1 topics-tab-selected">
18
-
18
+
19
- <div class="topics-tab-inner">
19
+ -------<div class="topics-tab-inner">
20
-
20
+
21
- <div class="topics-tab-label">主要</div>
21
+ --------<div class="topics-tab-label">主要</div>
22
-
22
+
23
- <ul class="topics-block-page">
23
+ --------<ul class="topics-block-page">
24
-
24
+
25
- <li><span class="topics-block-pointer topics-block-current"></span></li>
25
+ ---------<li><span class="topics-block-pointer topics-block-current"></span></li>
26
-
26
+
27
- <li><span class="topics-block-pointer"></span></li>
27
+ ---------<li><span class="topics-block-pointer"></span></li>
28
-
28
+
29
- </ul>
29
+ --------</ul>
30
-
30
+
31
- </div>
31
+ ------</div>
32
-
32
+
33
- </li>
33
+ ------</li>
34
34
 
35
35
 
36
36
 
37
- </ul>
37
+ ----</ul>
38
+
39
+ --</div>
40
+
41
+
42
+
43
+ <div id="topics-block-swipe-1" class="swiper-container topics-block-item">
44
+
45
+ --<div class="swiper-wrapper">
46
+
47
+ ----<div class="swiper-slide">
48
+
49
+ ------<div class="content-slide">
50
+
51
+ --------<ul class="article-list" page="1" category="main" data-category="主要">
52
+
53
+ ----------<li class="article-list-headline">
54
+
55
+ ------------<a href="#">
56
+
57
+ --------------<div class="article-list-headline-inner">
58
+
59
+ ----------------<div class="article-list-headline-image">
60
+
61
+ ------------------<img src="img/news-img_1.png" alt="">
62
+
63
+ ---------------</div>
64
+
65
+ ---------------<p class="article-list-headline-title"></p>
66
+
67
+ --------------</div>
68
+
69
+ ------------</a>
70
+
71
+ ----------</li>
72
+
73
+ ----------<li>
74
+
75
+ ------------<a href="#">
76
+
77
+ --------------<p class="article-title">
78
+
79
+ ----------------<span class="meta-new">New</span>
80
+
81
+ --------------</p>
82
+
83
+ ------------</a>
84
+
85
+ ----------</li>
86
+
87
+ ----------<li>
88
+
89
+ ------------<a href="#">
90
+
91
+ --------------<p class="article-title">
92
+
93
+ ----------------<span class="meta-new">New</span>
94
+
95
+ --------------</p>
96
+
97
+ ------------</a>
98
+
99
+ ----------</li>
100
+
101
+ ----------<li>
102
+
103
+ ------------<a href="#">
104
+
105
+ --------------<p class="article-title">
106
+
107
+ ----------------<span class="meta-new">New</span>
108
+
109
+ --------------</p>
110
+
111
+ ------------</a>
112
+
113
+ ----------</li>
114
+
115
+ ----------<li>
116
+
117
+ ------------<a href="#">
118
+
119
+ --------------<p class="article-title">
120
+
121
+ ----------------<span class="meta-new">New</span>
122
+
123
+ --------------</p>
124
+
125
+ ------------</a>
126
+
127
+ ----------</li>
128
+
129
+ ----------<li>
130
+
131
+ ------------<a href="#">
132
+
133
+ --------------<p class="article-title">
134
+
135
+ ----------------<span class="meta-new">New</span>
136
+
137
+ --------------</p>
138
+
139
+ ------------</a>
140
+
141
+ ----------</li>
142
+
143
+ ----------<li>
144
+
145
+ ------------<a href="#">
146
+
147
+ --------------<p class="article-title">
148
+
149
+ ----------------<span class="meta-new">New</span>
150
+
151
+ --------------</p>
152
+
153
+ ------------</a>
154
+
155
+ ----------</li>
156
+
157
+
158
+
159
+ --------</ul>
160
+
161
+ ------</div>
162
+
163
+ ----</div>
164
+
165
+ --<div class="swiper-wrapper">
166
+
167
+ ----<div class="swiper-slide">
168
+
169
+ ------<div class="content-slide">
170
+
171
+ --------<ul class="article-list" page="2" category="main" data-category="主要">
172
+
173
+ ----------<li class="article-list-headline">
174
+
175
+ ------------<a href="#">
176
+
177
+ --------------<div class="article-list-headline-inner">
178
+
179
+ ----------------<div class="article-list-headline-image">
180
+
181
+ ------------------<img src="img/news-img_1.png" alt="">
182
+
183
+ ---------------</div>
184
+
185
+ ---------------<p class="article-list-headline-title"></p>
186
+
187
+ --------------</div>
188
+
189
+ ------------</a>
190
+
191
+ ----------</li>
192
+
193
+ ----------<li>
194
+
195
+ ------------<a href="#">
196
+
197
+ --------------<p class="article-title">
198
+
199
+ ----------------<span class="meta-new">New</span>
200
+
201
+ --------------</p>
202
+
203
+ ------------</a>
204
+
205
+ ----------</li>
206
+
207
+ ----------<li>
208
+
209
+ ------------<a href="#">
210
+
211
+ --------------<p class="article-title">
212
+
213
+ ----------------<span class="meta-new">New</span>
214
+
215
+ --------------</p>
216
+
217
+ ------------</a>
218
+
219
+ ----------</li>
220
+
221
+ ----------<li>
222
+
223
+ ------------<a href="#">
224
+
225
+ --------------<p class="article-title">
226
+
227
+ ----------------<span class="meta-new">New</span>
228
+
229
+ --------------</p>
230
+
231
+ ------------</a>
232
+
233
+ ----------</li>
234
+
235
+ ----------<li>
236
+
237
+ ------------<a href="#">
238
+
239
+ --------------<p class="article-title">
240
+
241
+ ----------------<span class="meta-new">New</span>
242
+
243
+ --------------</p>
244
+
245
+ ------------</a>
246
+
247
+ ----------</li>
248
+
249
+ ----------<li>
250
+
251
+ ------------<a href="#">
252
+
253
+ --------------<p class="article-title">
254
+
255
+ ----------------<span class="meta-new">New</span>
256
+
257
+ --------------</p>
258
+
259
+ ------------</a>
260
+
261
+ ----------</li>
262
+
263
+ ----------<li>
264
+
265
+ ------------<a href="#">
266
+
267
+ --------------<p class="article-title">
268
+
269
+ ----------------<span class="meta-new">New</span>
270
+
271
+ --------------</p>
272
+
273
+ ------------</a>
274
+
275
+ ----------</li>
276
+
277
+
278
+
279
+ --------</ul>
280
+
281
+ ------</div>
282
+
283
+ ----</div>
284
+
285
+
38
286
 
39
287
  </div>
40
288
 
41
- <div id="topics-block-swipe-1" class="swiper-container topics-block-item">
42
-
43
- <div class="swiper-wrapper">
44
-
45
- <div class="swiper-slide">
46
-
47
- <div class="content-slide">
48
-
49
- <ul class="article-list" page="1" category="main" data-category="主要">
50
-
51
- <li class="article-list-headline">
52
-
53
- <a href="#">
54
-
55
- <div class="article-list-headline-inner">
56
-
57
- <div class="article-list-headline-image">
58
-
59
- <img src="img/news-img_1.png" alt="">
60
-
61
- </div>
62
-
63
- <p class="article-list-headline-title"></p>
64
-
65
- </div>
66
-
67
- </a>
68
-
69
- </li>
70
-
71
- <li>
72
-
73
- <a href="#">
74
-
75
- <p class="article-title">
76
-
77
- <span class="meta-new">New</span>
78
-
79
- </p>
80
-
81
- </a>
82
-
83
- </li>
84
-
85
- <li>
86
-
87
- <a href="#">
88
-
89
- <p class="article-title"></p>
90
-
91
- </a>
92
-
93
- </li>
94
-
95
- <li>
96
-
97
- <a href="#">
98
-
99
- <p class="article-title"></p>
100
-
101
- </a>
102
-
103
- </li>
104
-
105
- <li>
106
-
107
- <a href="#">
108
-
109
- <p class="article-title"></p>
110
-
111
- </a>
112
-
113
- </li>
114
-
115
- <li>
116
-
117
- <a href="#">
118
-
119
- <p class="article-title"></p>
120
-
121
- </a>
122
-
123
- </li>
124
-
125
- <li>
126
-
127
- <a href="#">
128
-
129
- <p class="article-title"></p>
130
-
131
- </a>
132
-
133
- </li>
134
-
135
- <li>
136
-
137
- <a href="#">
138
-
139
- <p class="article-title"></p>
140
-
141
- </a>
142
-
143
- </li>
144
-
145
- <li>
146
-
147
- <a href="#">
148
-
149
- <p class="article-title"></p>
150
-
151
- </a>
152
-
153
- </li>
154
-
155
- <li>
156
-
157
- <a href="#">
158
-
159
- <p class="article-title"></p>
160
-
161
- </a>
162
-
163
- </li>
164
-
165
- </ul>
166
-
167
- </div>
168
-
169
- </div>
170
-
171
- <div class="swiper-slide">
172
-
173
- <div class="content-slide">
174
-
175
- <ul class="article-list" page="2" category="main" data-category="主要">
176
-
177
- <li class="article-list-headline">
178
-
179
- <a href="#">
180
-
181
- <div class="article-list-headline-inner">
182
-
183
- <div class="article-list-headline-image">
184
-
185
- <img src="img/news-img_1.png" alt="">
186
-
187
- </div>
188
-
189
- <p class="article-list-headline-title"></p>
190
-
191
- </div>
192
-
193
- </a>
194
-
195
- </li>
196
-
197
- <li>
198
-
199
- <a href="#">
200
-
201
- <p class="article-title"></p>
202
-
203
- </a>
204
-
205
- </li>
206
-
207
- <li>
208
-
209
- <a href="#">
210
-
211
- <p class="article-title"></p>
212
-
213
- </a>
214
-
215
- </li>
216
-
217
- <li>
218
-
219
- <a href="#">
220
-
221
- <p class="article-title"></p>
222
-
223
- </a>
224
-
225
- </li>
226
-
227
- <li>
228
-
229
- <a href="#">
230
-
231
- <p class="article-title"></p>
232
-
233
- </a>
234
-
235
- </li>
236
-
237
- <li>
238
-
239
- <a href="#">
240
-
241
- <p class="article-title"></p>
242
-
243
- </a>
244
-
245
- </li>
246
-
247
- <li>
248
-
249
- <a href="#">
250
-
251
- <p class="article-title">?</p>
252
-
253
- </a>
254
-
255
- </li>
256
-
257
- <li>
258
-
259
- <a href="#">
260
-
261
- <p class="article-title"></p>
262
-
263
- </a>
264
-
265
- </li>
266
-
267
- <li>
268
-
269
- <a href="#">
270
-
271
- <p class="article-title"></p>
272
-
273
- </a>
274
-
275
- </li>
276
-
277
- <li>
278
-
279
- <a href="#">
280
-
281
- <p class="article-title"></p>
282
-
283
- </a>
284
-
285
- </li>
286
-
287
- </ul>
288
-
289
- </div>
290
-
291
- </div>
292
-
293
-
294
-
295
289
  </div>
296
290
 
297
- </div>
298
-
299
291
 
300
292
 
301
293
  htmlは現在このようになっています。

1

説明の追加

2019/11/28 07:32

投稿

takumi1113
takumi1113

スコア7

test CHANGED
@@ -1 +1 @@
1
- タブ切り替え スワイプ swiper.js
1
+ タブ切り替え スワイプ swiper.js
test CHANGED
@@ -299,3 +299,5 @@
299
299
 
300
300
 
301
301
  htmlは現在このようになっています。
302
+
303
+ 文字制限城タブが一つですが、実際は参考サイトのように5つタブがあります。