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怎么改变div的位置

css文字如何隐藏

css怎么设置某一块固定

如何利用css改变input光标颜色

如何解决eclipse css文件乱码问题

css中如何清除float

css怎么实现内容超出隐藏效果

js与css的区别是什么

css中的display属性有哪些值?各有什么作用?

css怎么实现六边形

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




打赏

取消

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

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

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

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

评论

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