質問編集履歴
1
CSS追記
test
CHANGED
File without changes
|
test
CHANGED
@@ -361,3 +361,81 @@
|
|
361
361
|
</html>
|
362
362
|
|
363
363
|
```
|
364
|
+
|
365
|
+
|
366
|
+
|
367
|
+
```css
|
368
|
+
|
369
|
+
|
370
|
+
|
371
|
+
.slider-wrap {
|
372
|
+
|
373
|
+
width: 600px;
|
374
|
+
|
375
|
+
padding: 10px;
|
376
|
+
|
377
|
+
margin: 0 auto;
|
378
|
+
|
379
|
+
border-radius: 10px;
|
380
|
+
|
381
|
+
background-color: #DDD;
|
382
|
+
|
383
|
+
box-shadow: 0 2px 5px rgba(50, 50, 50, 0.4);
|
384
|
+
|
385
|
+
}
|
386
|
+
|
387
|
+
.slider-area {
|
388
|
+
|
389
|
+
position: relative;
|
390
|
+
|
391
|
+
width: 600px;
|
392
|
+
|
393
|
+
height: 300px;
|
394
|
+
|
395
|
+
background-color: #FFF;
|
396
|
+
|
397
|
+
overflow: hidden;
|
398
|
+
|
399
|
+
}
|
400
|
+
|
401
|
+
.slider-list {
|
402
|
+
|
403
|
+
position: absolute;
|
404
|
+
|
405
|
+
top: 0;
|
406
|
+
|
407
|
+
left: 0;
|
408
|
+
|
409
|
+
width: 2400px;
|
410
|
+
|
411
|
+
height: 300px;
|
412
|
+
|
413
|
+
}
|
414
|
+
|
415
|
+
.slider-list > li { float: left; }
|
416
|
+
|
417
|
+
.slider-ctrl-btn {
|
418
|
+
|
419
|
+
position: absolute;
|
420
|
+
|
421
|
+
top: 50%;
|
422
|
+
|
423
|
+
width: 30px;
|
424
|
+
|
425
|
+
height: 30px;
|
426
|
+
|
427
|
+
margin-top: -15px;
|
428
|
+
|
429
|
+
cursor: pointer;
|
430
|
+
|
431
|
+
border-radius: 15px;
|
432
|
+
|
433
|
+
background-color: rgba(255, 255, 255, 0.5);
|
434
|
+
|
435
|
+
}
|
436
|
+
|
437
|
+
.slider-ctrl-btn.prev { left: 30px; }
|
438
|
+
|
439
|
+
.slider-ctrl-btn.next { right: 30px; }
|
440
|
+
|
441
|
+
```
|