1至9填入九个方框内_1+X证书 Web前端开发【初级】实操考试1（试题一）

关注我，让我成为你的专属小太阳吧

试题一(22分)

阅读下列说明、效果图和HTML代码，进行静态网页开发，填写(1)至(11)代码。

【说明】

这是某电商类网站服装商品展示页面局部，该网站正在促销秋冬季女装。现在我们需要编写该网站效果图部分代码。

项目名称为shopping，包含首页index.html、css文件夹、img文件夹，其中，css文件夹包含index.css文件；img文件夹包含img1.jpg、img2.jpg、img3.jpg、img4.jpg、img5.jpg图片。

【效果图】

图1-1

【代码：首页index.html】

商品展示 < (1) >     微胖连衣裙     2019网红初秋女装     黑色休闲裤     韩版学生女装     原创设计女装 (2)>

【代码：CSS文件index.css】

body,h1,h2,h3,h4,h5,h6,p,ul,ol,dl,dd{ margin: 0; padding:0; } /*清理默认li样式*/ ul{ (3) : (4) ; } /*显示为块级元素*/ img{ (5)  :  (6) ; } /*清理左右浮动*/ .clear:after{ content: ""; display: block; (7) : (8) ; } .box{ width: 100%; } .box .con{ width: 1375px; margin:0 auto; } .box .con ul{ padding-top:30px; } /*左浮动*/ .box .con ul li{ (9) : (10) ; width: 250px; margin:0 22px 22px 0; border:1px solid #eee; } .box .con ul li img{ margin:15px auto 0; } .box .con ul li p{ padding:15px; } /*设置鼠标移入添加红色边框*/ .box .con ul li: (11) { border:1px solid red; }

【问题】(22分，每空2分)

进行静态网页开发，补全代码，在(1)至(11)处填入正确的内容。

公衆號：廣東考證中心

有趣的灵魂在等你

长按扫码可关注