dw怎么用css做图片轮播


当前第2页 返回上一页

1

2

3

4

5

6

7

8

9

10

11

12

13

14

15

16

17

18

19

20

21

22

23

24

25

26

27

28

29

30

31

32

33

34

35

36

37

38

39

40

41

42

43

44

45

46

47

48

49

50

51

52

53

54

@CHARSET "UTF-8";

body {

    background-image:url("./images/sdl (31).png");

    background-attachment: fixed;

}

h1 {

    font: bold 35px/60px Helvetica, Arial, Sans-serif;

    text-align: center; color: #eee;

    text-shadow: 0px 2px 6px #333;

}

#images {

    width: 400px;

    height: 600px;

    overflow: hidden;

    position: relative;

    margin: 20px auto;

}

#images img {

    width: 400px;

    height: 600px;

    position: absolute;

    top: 0;

    left: -400px;

    z-index: 1;

    opacity: 1;

    transition: all linear 500ms;

    -o-transition: all linear 500ms;

    -moz-transition: all linear 500ms;

    -webkit-transition: all linear 500ms;

}

#images img:target {

    left: 0;

    z-index: 9;

    opacity: 1;

}

#images img:first-child {

    left: 0;

}

#slider {

    width: 150px;

    height: 30px;

    margin: 20px auto;

}

#slider a {

    text-decoration: none;

    background: #45b97c;

    border: 1px solid #C6E4F2;

    padding: 4px 6px;

    color: #222;

    margin: 20px auto;

}

#slider a:hover {

    background: #C6E4F2;

}

以上就是dw怎么用css做图片轮播的详细内容,更多文章请关注木庄网络博客

返回前面的内容

相关阅读 >>

css flex布局的优缺点是什么

css怎么实现多行文本溢出隐藏

css怎么设置a标签颜色

css怎么去掉输入框的边框

css border-image-slice属性怎么用

css如何改变鼠标

input实现文字超出省略号(代码示例)

css实现div一直旋转的方法

已知和未知高度下进行垂直水平居中的方法

css图片怎么设置透明度

更多相关阅读请进入《css》频道 >>




打赏

取消

感谢您的支持,我会继续努力的!

扫码支持
扫码打赏,您说多少就多少

打开支付宝扫一扫,即可进行扫码打赏哦

分享从这里开始,精彩与您同在

评论

管理员已关闭评论功能...