小伙伴们,根据所给素材制作如下图所示的TOP排行新闻列表。
图片素材:
图片引用,请使用此地址 http://img1.sycdn.imooc.com//53cf0fa20001d3dc00200032.jpg
温馨提示:完成任务后,请验证是否与实践描述效果一致,如一致,恭喜您,你已经掌握此技能,否则,请重复学习此节内容吆。
在右边代码编程器中9行处添加以下CSS样式:
一、定义topList类选择器,设置其宽为300px,高为180px,边框线为1px实线 颜色为#E8E8E8,并让其在页面中水平居中。
二、去除项目列表项的项目符号,并设置整个列表ul四个方向填充均为5px。
三、设置em标签样式为宽20px,高16px,水平居中,不倾斜,颜色为#333,并设置背景图片。
四、单独设置.top中的em标签的背景图片。
五、控制超链接的四种状态。
提示: background-position的详细用法参考http://www.imooc.com/wenda/detail/12584 注意: 1.em为内联元素,要把他改为块级元素后,设置的宽度和高度才有效 2.所有em的背景图片均为num.gif,通过设置background-position属性来控制不同列表项显示不同的背景图片
小伙伴们,可以在右下角的"源代码下载"区,下载参考代码。
请验证,完成请求
由于请求次数过多,请先验证,完成再次请求
打开微信扫码自动绑定
绑定后可得到
使用 Ctrl+D 可将课程添加到书签
举报