时间：2023-08-02 08:57:02 | 来源：网站运营
时间：2023-08-02 08:57:02 来源：网站运营
品优购：
在线咨询
/* 内外边距清零 */* { margin: 0; padding: 0; /* css3盒子模型 */ box-sizing: border-box;}/* em 和 i 斜体的文字不倾斜 */em,i { font-style: normal}/* 去掉li 的小圆点 */li { list-style: none}img { /* border 0 照顾低版本浏览器 如果 图片外面包含了链接会有边框的问题 */ border: 0; /* 取消图片底侧有空白缝隙的问题 */ vertical-align: middle}button { /* 当我们鼠标经过button 按钮的时候，鼠标变成小手 */ cursor: pointer}a { color: #666; text-decoration: none}a:hover { color: #c81623}button,input { /* "/5B8B/4F53" 就是宋体的意思 这样浏览器兼容性比较好 */ font-family: Microsoft YaHei, Heiti SC, tahoma, arial, Hiragino Sans GB, "/5B8B/4F53", sans-serif; /* 默认有灰色边框我们需要手动去掉 */ border: 0; outline: none;}body { /* CSS3 抗锯齿形 让文字显示的更加清晰 */ -webkit-font-smoothing: antialiased; background-color: #fff; font: 12px/1.5 Microsoft YaHei, Heiti SC, tahoma, arial, Hiragino Sans GB, "/5B8B/4F53", sans-serif; color: #666}.hide,.none { display: none}/* 清除浮动 */.clearfix:after { visibility: hidden; clear: both; display: block; content: "."; height: 0}.clearfix { *zoom: 1}/* 版心 */.w{ width: 1200px; margin: 0 auto;}.fl{ float: left;}.fr{ float: right;}.style_red{ color: #c81623;}快捷导航栏（还运用到了字体图标）：/* 导入字体图标 */@font-face { font-family: 'iconfont'; /* project id 2165991 */ src: url('https://at.alicdn.com/t/font_2165991_a7yxzjewf06.eot'); src: url('https://at.alicdn.com/t/font_2165991_a7yxzjewf06.eot?#iefix') format('embedded-opentype'), url('https://at.alicdn.com/t/font_2165991_a7yxzjewf06.woff2') format('woff2'), url('https://at.alicdn.com/t/font_2165991_a7yxzjewf06.woff') format('woff'), url('https://at.alicdn.com/t/font_2165991_a7yxzjewf06.ttf') format('truetype'), url('https://at.alicdn.com/t/font_2165991_a7yxzjewf06.svg#iconfont') format('svg'); } @font-face { font-family: 'iconfont'; /* project id 2165991 */ src: url('https://at.alicdn.com/t/font_2165991_2c9zgdjlo3k.eot'); src: url('https://at.alicdn.com/t/font_2165991_2c9zgdjlo3k.eot?#iefix') format('embedded-opentype'), url('https://at.alicdn.com/t/font_2165991_2c9zgdjlo3k.woff2') format('woff2'), url('https://at.alicdn.com/t/font_2165991_2c9zgdjlo3k.woff') format('woff'), url('https://at.alicdn.com/t/font_2165991_2c9zgdjlo3k.ttf') format('truetype'), url('https://at.alicdn.com/t/font_2165991_2c9zgdjlo3k.svg#iconfont') format('svg'); } @font-face { font-family: 'iconfont'; /* project id 2165991 */ src: url('https://at.alicdn.com/t/font_2165991_iqtafbj0crh.eot'); src: url('https://at.alicdn.com/t/font_2165991_iqtafbj0crh.eot?#iefix') format('embedded-opentype'), url('https://at.alicdn.com/t/font_2165991_iqtafbj0crh.woff2') format('woff2'), url('https://at.alicdn.com/t/font_2165991_iqtafbj0crh.woff') format('woff'), url('https://at.alicdn.com/t/font_2165991_iqtafbj0crh.ttf') format('truetype'), url('https://at.alicdn.com/t/font_2165991_iqtafbj0crh.svg#iconfont') format('svg'); } .iconfont { font-family: 'iconfont'; }/* 快捷导航模块 */.shortcut{ height: 31px; background-color: #f1f1f1; line-height: 31px;}.shortcut ul li{ float: left;}.shortcut .fr ul li:nth-child(even){ width: 1px; height: 12px; background-color:#666666 ; margin: 9px 15px 0;}HTML部分：<div class="shortcut"> <div class="w"> <div class="fl"> <ul> <li>品优购欢迎您！ </li> <li> <a href="#">请登录 </a> <a href="#" class="style_red">免费注册</a> </li> </ul> </div> <div class="fr"> <ul> <li>我的订单</li> <li></li> <li class="iconfont">我的品优购 </li> <li></li> <li>品优购会员</li> <li></li> <li>企业采购</li> <li></li> <li class="iconfont">关注品优购 </li> <li></li> <li class="iconfont">客户服务 </li> <li></li> <li class="iconfont">网站导航 </li> </ul> </div> </div> </div> <!-- logo标志 --> <div class="logo"> <h1> <a href="index.html" title="品优购">品优购</a> </h1> </div>CSS：/* logo */.logo{ position: absolute; height: 61px; width: 171px; top:25px;}.logo a{ display: block; height: 61px; width: 171px; background: url(../images/logo.png);/* 将文字大小设置为0，隐藏文字，京东做法 */ font-size: 0;}<div class="search"> <input type="search" placeholder="语言开发"> <button>搜索</button> </div>CSS：/* 搜索框模块 */.search{ position: absolute; top: 25px; left: 346px; width: 538px; height: 36px; border: 2px solid #c81623;}.search input{ float: left; width: 454px; height: 32px; padding-left: 10px;}.search button{ float: left; width: 80px; height: 32px; background-color: #c81623; font-size: 16px; color: #ffffff;} <div class="hotwords"> <a href="#" class="style_red">优惠购首发</a> <a href="#">亿元优惠</a> <a href="#">9.9元团购</a> <a href="#">美满99减30</a> <a href="#">办公用品</a> <a href="#">电脑</a> <a href="#">通信</a></div>CSS:.hotwords{ position: absolute; top: 66px; left: 346px; }.hotwords a{ margin-right: 10px; margin-left: 10px;}<div class="shopcar iconfont"> 我的购物车 <i class="count">8 </i> </div>CSS:.shopcar{ position: absolute; top: 25px; right: 64px; width: 142px; height: 35px; line-height: 35px; text-align: center; font-size: 12px; color:#666666 ; border: 1px solid #dfdfdf; background-color: #f7f7f7;}.count { position: absolute; top: -5px; left: 100px; height: 14px; line-height: 14px; color: #fff; background-color: #e60012; padding: 0 5px; border-radius: 7px 7px 7px 0;} <div class="dropdown"> <div class="dt">全部商品分类</div> <div class="dd"> <ul class="iconfont"> <li><a href="#">家用电器 </a> </li> <li><a href="#">手机</a>、 <a href="#">数码</a>、<a href="#">通信 </a> </li> <li><a href="#">电脑、办公 </a> </li> <li><a href="#">家居、家具、家装、厨具 </a> </li> <li><a href="#">男装、女装、童装、内衣 </a> </li> <li><a href="#">个户化妆、清洁用品、宠物 </a> </li> <li><a href="#">鞋靴、箱包、珠宝、奢侈品 </a> </li> <li><a href="#">运动户外、钟表 </a> </li> <li><a href="#">汽车、汽车用品 </a> </li> <li><a href="#">母婴、玩具乐器 </a> </li> <li><a href="#">食品、酒类、生鲜、特产 </a> </li> <li><a href="#">医药保健 </a> </li> <li><a href="#">图书、音像、电子书</a> </li> <li><a href="#">彩票、旅行、充值、票务</a> </li> <li><a href="#">理财、众筹、白条、保险</a> </li> </ul> </div><div>CSS部分：：.dropdown{ float: left; width: 210px; height: 47px; background-color: #c81623 ;}.dropdown .dt{ font-size: 16px; color: #fff; line-height: 47px; text-align: center;}.dropdown .dd{ width: 210px; height: 465px; background-color: #c81623 ;}.dropdown .dd ul li{ position: relative; height: 31px; line-height: 31px; margin-left: 2px; padding-left: 10px;}.dropdown .dd ul li:hover{ background-color: #fff;}.dropdown .dd ul li a{ font-size: 14px; color: #fff;}.dropdown .dd ul li:hover a{ color:#c81623 ;}.navitems ul li{ float: left; }.navitems ul li a{ display: block; font-size: 16px; line-height: 47px; text-align: center; padding: 0 25px;} <div class="footer"><div class="w"> <div class="service"> <ul> <li class="service_txt1"> <h5></h5> <div> <h4>正品保障</h4> <p>正品保障,提供发票</p> </div> </li> <li class="service_txt2"> <h5></h5> <div> <h4>极速物流</h4> <p>急速物流，急速送达</p> </div> </li> <li class="service_txt3"> <h5></h5> <div> <h4>无忧售后</h4> <p>7天无理由退换货</p> </div> </li> <li class="service_txt4"> <h5></h5> <div> <h4>特色服务</h4> <p>私人定制家电套餐</p> </div> </li> <li class="service_txt5"> <h5></h5> <div> <h4>帮助中心</h4> <p>您的购物指南</p> </div> </li> </ul> </div> </div></div>CSS部分：.footer{ margin-top: 555px; padding-top: 30px; height: 415px; background-color: #f5f5f5;}.service{ height: 80px; border-bottom: 2px solid #ededed;}.service ul li{ float: left; width: 200px; height: 50px; /* background-color: rgb(238, 208, 144); */ padding-left: 35px; margin-right: 35px;}.service ul li h5{ float: left; height: 50px; width: 50px; background-color: limegreen; margin-right: 7px;}.service ul .service_txt1 h5{ background: url(../images/jinglintu.png) no-repeat -252px -2px;}.service ul .service_txt2 h5{ background: url(../images/jinglintu.png) no-repeat -254px -53px;}.service ul .service_txt3 h5{ background: url(../images/jinglintu.png) no-repeat -257px -105px;}.service ul .service_txt4 h5{ background: url(../images/jinglintu.png) no-repeat -257px -156px;}.service ul .service_txt5 h5{ background: url(../images/jinglintu.png) no-repeat -256px -209px;}.service h4{ font-size: 14px;}.service p{ font-size: 12px;}中间help模块： <div class="help"> <dl> <dt>购物指南</dt> <dd><a href="#">购物流程</a></dd> <dd><a href="#">会员介绍</a></dd> <dd><a href="#">生活旅行/团购</a></dd> <dd><a href="#">常见问题</a></dd> <dd><a href="#">大家电</a></dd> <dd><a href="#">联系客服</a></dd> </dl> <dl> <dt>配送方式</dt> <dd><a href="#">上门自提</a></dd> <dd><a href="#">211限时达</a></dd> <dd><a href="#">配送服务查询</a></dd> <dd><a href="#">配送费收取标准</a></dd> <dd><a href="#">海外配送</a></dd> </dl> <dl> <dt>支付方式</dt> <dd><a href="#">货到付款</a></dd> <dd><a href="#">在线支付</a></dd> <dd><a href="#">分期付款</a></dd> <dd><a href="#">邮局汇款</a></dd> <dd><a href="#">公司转账</a></dd> </dl> <dl> <dt>售后服务</dt> <dd><a href="#">售后政策</a></dd> <dd><a href="#">价格保护</a></dd> <dd><a href="#">退款说明</a></dd> <dd><a href="#">返修/退换货</a></dd> <dd><a href="#">取消订单</a></dd> </dl> <dl> <dt>特色服务</dt> <dd><a href="#">夺宝岛</a></dd> <dd><a href="#">DIY装机</a></dd> <dd><a href="#">延保服务</a></dd> <dd><a href="#">品优购E卡</a></dd> <dd><a href="#">品优购通信</a></dd> </dl> <dl> <dt>帮助中心</dt> <dd class="img"></dd> <dd>品优购客户端</dd> </dl> </div>CSS部分：.help{ height: 185px; border-bottom: 2px solid #ededed; padding-left: 50px; margin-top: 21px;}.help dl{ float: left; width: 200px;}.help dl:last-child { width: 90px; text-align: center;}.help dt{ font-size: 16px; margin-bottom: 14px;}.help dd{ font-size: 12px;}.help .img{ width: 92px; height: 92px; background: url(../images/erweima.jpg);}底部copyright模块：<div class="copyright"> <div class="links"> <a href="#">关于我们</a> | <a href="#">联系我们</a> | <a href="#">联系客服 </a> | <a href="#">商家入驻</a> | <a href="#">营销中心</a> | <a href="#">手机品优购</a> | <a href="#">友情链接</a> | <a href="#">销售联盟</a> | <a href="#">品优购社区</a> | <a href="#">品优购公益</a> | <a href="#">English Site</a> | <a href="#">Contact U</a> </div> <div class="copyright_address"> 地址：杭州市昌平区建材城西路金燕龙办公楼一层 邮编：100096 电话：400-618-4000 传真：010-82935100 邮箱: zhanghj+itcast.cn <br> 京ICP备08001421号京公网安备110108007702 </div> </div>CSS部分：.links{ margin: 10px auto; text-align: center;}.copyright_address{ text-align: center; margin-bottom: 10px;} <div class="w"> <div class="main"> <!-- 焦点图 --> <div class="focus"></div> <!-- 快报 --> <div class="newsflash"> <div class="news"> <div class="news_hd"> <h5>品优购快报</h5> <a href="#" class="more iconfont">更多 </a> </div> <div class="news_bd"> <ul> <li><a href="#"><strong>[特惠]</strong> 备战开学季 全民半价购数码</a></li> <li><a href="#"><strong>[公告]</strong> 品优稳占家电网购六成份额</a></li> <li><a href="#"><strong>[特惠]</strong> 百元中秋全品类礼券限时领</a></li> <li><a href="#"><strong>[公告]</strong> 生鲜 享阳澄湖大闸蟹</a></li> <li><a href="#"><strong>[特惠]</strong> 每日享折扣品优品质游</a></li> </ul> </div> </div> <div class="lifeservice"> <ul> <li> <i class="service_img1"></i> <p>话费</p> </li> <li> <i class="service_img2"></i> <p>话费</p> </li> <li> <i class="service_img3"></i> <p>话费</p> </li> <li> <i class="service_img4"></i> <p>话费</p> </li> <li> <i class="service_img5"></i> <p>话费</p> </li> <li> <i class="service_img6"></i> <p>话费</p> </li> <li> <i class="service_img7"></i> <p>话费</p> </li> <li> <i class="service_img8"></i> <p>话费</p> </li> <li> <i class="service_img9"></i> <p>话费</p> </li> <li> <i class="service_img10"></i> <p>话费</p> </li> <li> <i class="service_img11"></i> <p>话费</p> </li> <li> <i class="service_img12"></i> <p>话费</p> </li> </ul> </div> <div class="bargain"> <img src="./images/bargain.png" alt=""> </div> </div>CSS部分：.main{ width: 980px; height: 455px; margin-top: 11px; margin-left: 220px;}.focus{ float: left; width: 721px; height: 455px; /* background-color: mediumseagreen; */ background: url(../images/jiaodiantu.png);}.newsflash{ float: right; width: 251px; height: 455px; /* background-color: orchid; */}.news{ height: 165px; border: 1px solid #e4e4e4;}.news_hd{ height: 33px; line-height: 33px; /* padding-top: 10px; */ border-bottom: 1px dotted #e4e4e4; padding: 0 15px;}.news_hd h5{ float: left; padding-left: 2px; font-size: 14px; } .news_hd .more{ float: right; /* padding-right: 13px; */ font-size: 12px; } .news_bd{ padding-left: 14px; padding: 5px 15px 0; } .news_bd ul li{ margin-top: 5px; margin-bottom: 5px; } .lifeservice { overflow: hidden; height: 209px; /* background-color: purple; */ border: 1px solid #e4e4e4; border-top: 0;}.lifeservice ul { width: 252px;}.lifeservice ul li { float: left; width: 63px; height: 71px; border-right: 1px solid #e4e4e4; border-bottom: 1px solid #e4e4e4; text-align: center;}.lifeservice ul li i { display: inline-block; width: 24px; height: 28px; background-color: pink; margin-top: 12px;}.lifeservice ul li .service_img1{ background: url(../images/jinglintu.png) no-repeat -16px -15px;}.lifeservice ul li .service_img2{ background: url(../images/jinglintu.png) no-repeat -79px -15px;}.lifeservice ul li .service_img3{ background: url(../images/jinglintu.png) no-repeat -142px -17px;}.lifeservice ul li .service_img4{ background: url(../images/jinglintu.png) no-repeat -205px -15px;}.lifeservice ul li .service_img5{ background: url(../images/jinglintu.png) no-repeat -16px -86px;}.lifeservice ul li .service_img6{ background: url(../images/jinglintu.png) no-repeat -77px -86px;}.lifeservice ul li .service_img7{ background: url(../images/jinglintu.png) no-repeat -142px -88px;}.lifeservice ul li .service_img8{ background: url(../images/jinglintu.png) no-repeat -205px -86px;}.lifeservice ul li .service_img9{ background: url(../images/jinglintu.png) no-repeat -16px -155px;}.lifeservice ul li .service_img10{ background: url(../images/jinglintu.png) no-repeat -79px -155px;}.lifeservice ul li .service_img11{ background: url(../images/jinglintu.png) no-repeat -142px -155px;}.lifeservice ul li .service_img12{ background: url(../images/jinglintu.png) no-repeat -205px -155px;} .bargain{ margin-top: 5px; height: 76px; /* background-color: paleturquoise; */ }<div class="recom w"> <div class="recom_hd"> <img src="./images/recom.png" alt=""> </div> <div class="recom_bd"> <ul> <li><img src="./images/recom01.png" alt=""></li> <li><img src="./images/recom02.png" alt=""></li> <li><img src="./images/recom03.png" alt=""></li> <li><img src="./images/recom04.jpg" alt=""></li> </ul> </div> </div>CSS部分：.recom{ height: 163px; /* background-color: plum; */ margin-top: 10px; } .recom_hd{ float: left; width: 206px; height: 163px; text-align: center; line-height: 163px; background-color: #5c5251; } .recom_bd{ float: left; } .recom_bd ul li { position: relative; float: left;}.recom_bd ul li img { width: 248px; height: 163px;}.recom_bd ul li:nth-child(-n+3)::after { content: ''; position: absolute; right: 0; top: 10px; width: 1px; height: 145px; background-color: #ddd;} <!-- 猜你喜欢模块 --> <div class="xihuan w"> <div class="xihuan_hd clearfix"> <h3> 猜你喜欢</h3> <a href="#" class="iconfont">换一批 </a> </div> <div class="xihuan_bd"> <ul> <li> <img src="./images/xihuan-1.png" alt=""> <h4> 阳光美包新款单肩包女 包时尚子母包四件套女 </h4> <div class="info"> <span>¥116.00</span> </div> </li> <li> <img src="./images/xihuan-1.png" alt=""> <h4> 阳光美包新款单肩包女 包时尚子母包四件套女 </h4> <div class="info"> <span>¥116.00</span> </div> </li> <li> <img src="./images/xihuan-1.png" alt=""> <h4> 阳光美包新款单肩包女 包时尚子母包四件套女 </h4> <div class="info"> <span>¥116.00</span> </div> </li> <li> <img src="./images/xihuan-1.png" alt=""> <h4> 阳光美包新款单肩包女 包时尚子母包四件套女 </h4> <div class="info"> <span>¥116.00</span> </div> </li> <li> <img src="./images/xihuan-1.png" alt=""> <h4> 阳光美包新款单肩包女 包时尚子母包四件套女 </h4> <div class="info"> <span>¥116.00</span> </div> </li> <li> <img src="./images/xihuan-1.png" alt=""> <h4> 阳光美包新款单肩包女 包时尚子母包四件套女 </h4> <div class="info"> <span>¥116.00</span> </div> </li> </ul> </div> </div>CSS部分：/* 猜你喜欢模块 */.xihuan{ margin-top: 30px;}.xihuan_hd h3{ float: left; font-size: 18xp;}.xihuan_hd a{ float: right; font-size: 12px; padding-right: 18px;}.xihuan_bd{ width: 1202px;height: 230px;border: 1px solid #ccc;margin-top: 12px;/* background-color: salmon; */}.xihuan_bd h4{ font-size: 12px; font-weight: 400; padding:0 49px 0 30px; border-right: 1px solid #ccc;}.xihuan_bd .info{ font-size: 18px; color:#df3033; padding-left: 30px; border-right: 1px solid #ccc;}.xihuan_bd ul li{ float: left; height: 230px; width: 200px; /* background-color: rgb(90, 205, 142); */} <!-- 1楼商品区域模块 --> <div class="floor"> <div class=" w jiadian"> <div class="box_hd"> <h3>家用电器</h3> <div class="tab_list"> <ul> <li> <a href="#" class="style_red">热门</a>|</li> <li><a href="#">大家电</a>|</li> <li><a href="#">生活电器</a>|</li> <li><a href="#">厨房电器</a>|</li> <li><a href="#">生活电器</a>|</li> <li><a href="#">个护健康</a>|</li> <li><a href="#">应季电器</a>|</li> <li><a href="#">空气/净水</a>|</li> <li><a href="#">新奇特</a>|</li> <li><a href="#"> 高端电器</a></li> </ul> </div> </div> <div class="box_bd"> <div class="tab_content"> <div class="tab_list_item"> <div class="col_210"> <ul> <li><a href="#">节能补贴</a></li> <li><a href="#">4K电视</a></li> <li><a href="#">空气净化器</a></li> <li><a href="#">IH电饭煲</a></li> <li><a href="#">滚筒洗衣机</a></li> <li><a href="#">电热水器</a></li> </ul> <a href="#"> <img src="./images/floor-1-1.png" alt=""> </a> </div> <div class="col_329"> <a href="#"> <img src="./images//floor-1-b01.png" alt=""> </a> </div> <div class="col_221"> <a href="#" class="bb"> <img src="./images//floor-1-2.png" alt=""></a> <a href="#"> <img src="./images//floor-1-3.png" alt=""></a> </div> <div class="col_221"> <a href="#"> <img src="./images//floor-1-4.png" alt=""></a> </div> <div class="col_219"> <a href="#" class="bb"> <img src="./images//floor-1-5.png" alt=""></a> <a href="#"> <img src="./images//floor-1-6.png" alt=""></a> </div> </div> </div> </div> </div> </div> <!-- 下面标签模块 --> <div class="w biaoqian"> <img src="./images/tubiao1.png" alt=""> </div>CSS部分：/* 家用电器模块 */.floor .w{ margin-top: 30px;}.box_hd{ height: 30px; border-bottom: 2px solid #c81623;} .box_hd h3{ float: left; font-size: 18px; color: #c81623 ; font-weight: 400;}.box_hd .tab_list{ float: right; line-height: 30px;}.box_hd .tab_list ul li{ float: left;}.box_hd .tab_list ul li a{ margin: 0 15px;}.box_bd{ height:361px;}.box_bd h4{ font-size: 12px;}.tab_list_item>div{ float: left; height: 361px;}.col_210{ width: 210px; background-color: #f9f9f9; text-align: center;}.col_210 ul li { float: left; width: 85px; height: 34px; border-bottom: 1px solid #ccc; text-align: center; line-height: 33px; margin-right: 10px;}.col_210 ul { padding-left: 12px;}.col_329{ width: 329px;}.col_221{ width: 221px; border-right: 1px solid #ccc;}.col_219{ width: 219px;}.bb { /* 一般情况下，a如果包含有宽度的盒子，a需要转为块级元素 */ display: block; border-bottom: 1px solid #ccc;}/* 下面标签模块 */.biaoqian .w{ height: 65px;}.biaoqian{margin-top: 21px;}下边两个手机和电脑楼层和上边一样样的。<!-- 热门疯抢模块 --> <div class="fengqiang w"> <div class="fengqiang_hd">热门疯抢</div> <div class="fengqiang_bd"> <div class="fengqiang_240"> <img src="./images/fengqiang-1.png" alt=""> </div> <div class="fengqiang_220"> <img src="./images/fengqiang-2.png" alt=""> <img src="./images/fengqiang-3.png" alt=""> </div> <div class="fengqiang_220"> <img src="./images/fengqiang-4.png" alt=""> <img src="./images/fengqiang-3.png" alt=""> </div> <div class="fengqiang_220"> <img src="./images/fengqiang-3.png" alt=""> <img src="./images/fengqiang-5.png" alt=""> </div> <div class="fengqiang_297"> <img src="./images/fengqiang-6.png" alt=""> </div> </div> </div>CSS部分：/* 热门疯抢模块 */.fengqiang_hd{ font-size: 18px;}.fengqiang_bd{ height: 283px; border: 1px solid #ccc;}.fengqiang_bd>div{ float: left;}.fengqiang_240{ width: 240px; border-right: 1px solid #ccc;}.fengqiang_220{ width: 220px; border-right: 2px solid #ccc;}.fengqiang_297{ width: 297px;}关键词：
