(大家可以下载源码在 hbuilder 中测试) 阅读下列说明、效果图和 HTML 代码,进行静态网页开发,填写( 1 )至( 11 )代码。 【说明】 这是某电商类网站服装商品展示页面局部,该网站正在促销秋冬季女装。现在我们需要编写该网站效果图部分代码。 项目名称为 jiaju ,包含首页 index.html 、 css 文件夹、 images 文件夹,其中, css 文件夹包含 style01.css 文件; img 文件夹包含 pic_1.jpg 、 pic_2.jpg 、 pic_3.jpg 、 pic_4.jpg 、 pic_5.jpg 图片。 【效果图】 【代码:首页 index.html 】 html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> 家居大视野 家居大视野 < (1) > 室外居家空间设计 室外居家空间设计 室外居家空间设计 室外居家空间设计 室外居家空间设计 (2) > 【代码: CSS 文件 index.css 】 @charset "utf-8"; /* CSS Document */ /* ( 3 )( 4 )、( 5 )( 6 )、( 7 )( 8 )分别清理默认外边距、内边距和 li 样式 */ * { ( 3 ) : ( 4 ) ; ( 5 ) : ( 6 ) ; ( 7 ) : ( 8 ) ; border: 0; } body { color: #000; font-size: 14px; font-family: " 宋体 "; } .box { width: 950px; height: 360px; /* ( 9 )( 10 )设置盒子居中浏览器 */ ( 9 ) : 0 ( 10 ) ; } h2 { width: 950px; height: 62px; font-size: 18px; /* ( 11 )( 12 )设置标题文字水平居中 */ ( 11 ) : ( 12 ) ; border-top: 5px solid #000; padding-top: 5px; background: url("../images/nav_bg.jpg") repeat-x; } a:link, a:visited { /* ( 13 )( 14 )超链接文字不显示下划线 */ ( 13 ) : ( 14 ) ; color: #000; /* ( 15 )( 16 )文字加粗 */ ( 15 ) : ( 16 ) ; } /* ( 17 )( 18 )超链接鼠标滑上状态 */ ( 17 ) : ( 18 ) ; { text-decoration: underline; color: #930; } ul { width: 932px; height: 288px; padding-left: 18px; } ul li { width: 165px; height: 255px; background: url("../images/bg.jpg"); /* ( 19 )( 20 )设置内边距为 4px */ ( 19 ) : ( 20 ) ; /* ( 21 )( 22 )设置左浮动 */ ( 21 ) : ( 22 ) ; margin-right: 9px; } p { padding-top: 10px; text-align: center; }