继续浏览精彩内容
慕课网APP
程序员的梦工厂
打开
继续
感谢您的支持,我会继续努力的
赞赏金额会直接到老师账户
将二维码发送给自己后长按识别
微信支付
支付宝支付

【九月打卡】第8天 javascript(轮播图上的按钮样式)

土星猪
关注TA
已关注
手记 76
粉丝 5
获赞 0

1.课程名称 :javascript 轮播图


课程章节:轮播图上的按钮样式


2.课程内容:

    添加按钮,和css部分

    

    首先添加圆点导航容器

    添加span class=dots

    http://img4.mukewang.com/631ee033000183dc11010643.jpg

    css写入dots主容器样式

    dots 也需要绝对定位的

     http://img2.mukewang.com/631ee1ea000137e610110498.jpg

     right0  底部24px  text-align,靠右对齐

     

    设置主容器的 dots.span

    水平显示在一条线

    宽度高度12px

    线高度12px

    border-radius :50% 变成圆型

    圆型的背景颜色和阴影颜色

    

: ():()

    margin-right

    右边距16

    http://img.mukewang.com/631ee28900015a7f12650613.jpg

    效果

    http://img.mukewang.com/631ee3a40001f27501750205.jpg

    圆点导航对应正在显示的图片时,需要它是白色底灰边框

    http://img4.mukewang.com/631ee41600019bf408150423.jpg

    设置阴影部分

    背景颜色白色

    

    效果:

    http://img3.mukewang.com/631ee45500010a0216130765.jpg

    三,本章重点,需要多跟着老师练习就可以了,都是一些样式代码O(∩_∩)O




打开App,阅读手记
0人推荐
发表评论
随时随地看视频慕课网APP