質問編集履歴

1

cssを追加しました

2020/07/07 10:20

投稿

globalplus
globalplus

スコア119

test CHANGED
File without changes
test CHANGED
@@ -127,3 +127,181 @@
127
127
  </body>
128
128
 
129
129
  ```
130
+
131
+ ```css
132
+
133
+ .swiper-container {
134
+
135
+ margin: 0 auto;
136
+
137
+ position: relative;
138
+
139
+ overflow: hidden;
140
+
141
+ /* Fix of Webkit flickering */
142
+
143
+ z-index: 1;
144
+
145
+ height: auto;
146
+
147
+ }
148
+
149
+
150
+
151
+ .swiper-container .swiper-wrapper {
152
+
153
+ height: auto;
154
+
155
+ min-height: 34.01vw;
156
+
157
+ }
158
+
159
+
160
+
161
+ @media (min-width: 1600px) {
162
+
163
+ .swiper-container .swiper-wrapper {
164
+
165
+ height: auto;
166
+
167
+ min-height: 696px;
168
+
169
+ }
170
+
171
+ }
172
+
173
+
174
+
175
+ .swiper-container-no-flexbox .swiper-slide {
176
+
177
+ float: left;
178
+
179
+ }
180
+
181
+
182
+
183
+ .swiper-container-vertical > .swiper-wrapper {
184
+
185
+ -ms-flex-direction: column;
186
+
187
+ flex-direction: column;
188
+
189
+ }
190
+
191
+
192
+
193
+ .swiper-wrapper {
194
+
195
+ position: relative;
196
+
197
+ width: 100%;
198
+
199
+ z-index: 1;
200
+
201
+ display: -ms-flexbox;
202
+
203
+ display: flex;
204
+
205
+ transition-property: -webkit-transform;
206
+
207
+ transition-property: transform;
208
+
209
+ transition-property: transform, -webkit-transform;
210
+
211
+ box-sizing: content-box;
212
+
213
+ -ms-flex-item-align: stretch;
214
+
215
+ align-self: stretch;
216
+
217
+ -ms-flex-align: stretch;
218
+
219
+ align-items: stretch;
220
+
221
+ }
222
+
223
+
224
+
225
+ .swiper-container-android .swiper-slide,
226
+
227
+ .swiper-wrapper {
228
+
229
+ -webkit-transform: translate3d(0px, 0, 0);
230
+
231
+ transform: translate3d(0px, 0, 0);
232
+
233
+ }
234
+
235
+
236
+
237
+ .swiper-container-multirow > .swiper-wrapper {
238
+
239
+ -webkit-box-lines: multiple;
240
+
241
+ -moz-box-lines: multiple;
242
+
243
+ -ms-flex-wrap: wrap;
244
+
245
+ flex-wrap: wrap;
246
+
247
+ }
248
+
249
+
250
+
251
+ .swiper-container-free-mode > .swiper-wrapper {
252
+
253
+ transition-timing-function: ease-out;
254
+
255
+ margin: 0 auto;
256
+
257
+ }
258
+
259
+
260
+
261
+ .swiper-slide {
262
+
263
+ position: relative;
264
+
265
+ display: -ms-flexbox;
266
+
267
+ display: flex;
268
+
269
+ -ms-flex-align: center;
270
+
271
+ align-items: center;
272
+
273
+ -webkit-flex-shrink: 0;
274
+
275
+ -ms-flex: 0 0 auto;
276
+
277
+ -ms-flex-negative: 0;
278
+
279
+ flex-shrink: 0;
280
+
281
+ width: 100%;
282
+
283
+ min-height: inherit;
284
+
285
+ }
286
+
287
+
288
+
289
+ /* a11y */
290
+
291
+ .swiper-container .swiper-notification {
292
+
293
+ position: absolute;
294
+
295
+ left: 0;
296
+
297
+ top: 0;
298
+
299
+ pointer-events: none;
300
+
301
+ opacity: 0;
302
+
303
+ z-index: -1000;
304
+
305
+ }
306
+
307
+ ```