老师请您帮忙看看为什么我的特色当地体验下面的照片没有居中呢
来源：1-1 课程简介
慕粉1924517932
2022-03-16 21:15:48
相关代码：HTML
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta name="keywords" content="机票，酒店，旅游攻略，签证，出国，自由行"> <meta name="Description" content="慕云游拥有10多年的旅游经验，可以为您提供全方位的旅游服务"> <title>慕云游-商城，机票，酒店，旅游攻略</title> <link rel="stylesheet" href="css/css.css"> <link rel="stylesheet" href="css/reset.css"> <link rel="stylesheet" href="css/bese.css"> </head> <body> <!-- 页首顶部大盒子 --> <header class="top-box"> <!-- 深色盒子 --> <div class="dark-box"> <!-- 深色盒子版心 --> <div class="core"> <ul> <li> <a href="javascript:;">目的地</a> </li> <li> <a href="javascript:;">锦囊</a> </li> <li class="cli"> <a href="javascript:;">社区</a> <em class="away"> <i></i> <b></b> </em> <div class="menus sqmenus"> <ul class="menus-list"> <li><a href="#">旅游论坛</a></li> <li><a href="#">旅游专栏</a></li> <li><a href="#">旅游问答</a></li> <li><a href="#">旅游生活分享平台</a></li> <li><a href="#">JEN旅游生活美学</a></li> <li><a href="#">BIU伴(原结伴同游)</a></li> <li><a href="#">负责任的旅行</a></li> <li><a href="#">特别策划</a></li> </ul> </div> </li> <li> <a href="javascript:;">行程助手</a> </li> <li class="cli"> <a href="javascript:;">商城</a> <em class="away"> <i></i> <b></b> </em> <div class="menut sqmenut"> <ul class="menut-list"> <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> </li> <li class="cli"> <a href="javascript:;">酒店·民宿</a> <em class="away"> <i></i> <b></b> </em> <div class="menur jdmenur"> <ul class="menur-list"> <li><a href="#">酒店</a></li> <li><a href="#">爱彼迎</a></li> <li><a href="#">华人旅馆</a></li> </ul> </div> </li> <li> <a href="javascript:;">特价酒店</a> </li> </ul> </div> <div class="right-layout"> <ul> <li> <a href="javascript:;"> <img src="image/icon_x2vd2ugr8r/fangdajing.png"> </a> </li> <li class="lis"> <a href="javascript:;"> <p></p> </a> </li> <li> <a href="javascript:;"> <img src="image/icon_x2vd2ugr8r/qq-fill.png"> </a> </li> <li> <a href="javascript:;"> <img src="image/icon_x2vd2ugr8r/xinlangweibo.png"> </a> </li> <li> <a href="javascript:;"> <img src="image/icon_x2vd2ugr8r/weixin.png"> </a> </li> <li> <a href="javascript:;"> <p>注册</p> </a> </li> <li> <a href="javascript:;"> <p>登录</p> </a> </li> </ul> </div> </div> <!-- 绿色的小盒子 --> <nav class="green-box"> <!-- 绿色盒子的版心 --> <div class="layout"> <ul> <li class="have"> <a href="javascript:;">机酒自由行</a> <p> <b></b> <i></i> </p> <div class="qb qbs"> <dl class="qb-list"> <dt class="lit"> <a href="#"> <h1>全部</h1> </a></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> <dd><a href="#">海岛游</a></dd> </dl> </div> </li> <li> <a href="javascript:;">优惠机票</a> </li> <li class="have"> <a href="javascript:;">跟团游</a> <p> <b></b> <i></i> </p> <div class="gt gts"> <dl class="gtss"> <dt><a href="#"> <h1>全部</h1> </a></dt> <dd><a href="#">跟团游</a></dd> <dd><a href="#">半自助游</a></dd> </dl> </div> </li> <li> <a href="javascript:;">酒店</a> </li> <li class="have"> <a href="javascript:;">当地玩乐</a> <p> <b></b> <i></i> </p> <div class="dd"> <dl class="ddwl"> <dt><a href="#"> <h1>全部</h1> </a></dt> <dd><a href="#">日游小团</a></dd> <dd><a href="#">深度体验</a></dd> <dd><a href="#">门票票券</a></dd> <dd><a href="#">餐饮美食</a></dd> <dd><a href="#">WIFI电话卡</a></dd> <dd><a href="#">购物</a></dd> <dd><a href="#">交通票券</a></dd> </dl> </div> </li> <li> <a href="javascript:;">签证</a> </li> <li> <a href="javascript:;">邮轮</a> </li> <li> <a href="javascript:;">河轮</a> </li> <li> <a href="javascript:;">保险</a> </li> <li> <a href="javascript:;">租车自驾</a> </li> <li class="have"> <a href="javascript:;">深度旅游</a> <p> <b></b> <i></i> </p> <div class="sd"> <dl class="sdly"> <dt><a href="#"> <h1>全部</h1> </a></dt> <dd><a href="#">City Walk</a></dd> <dd><a href="#">特色长线</a></dd> <dd><a href="#">Q-Home</a></dd> </dl> </div> </li> <li> <a href="javascript:;">私人定制</a> </li> </ul> </div> </nav> <!-- 图片LOGO和搜索框盒子 --> <nav class="logo-box"> <div class="log"> <div class="logo"> <h1>慕云游商城</h1> </div> <div class="Search-box"> <input type="search"> <!-- 放大镜盒子 --> <div class="magnifier"> <img src="image/icon_x2vd2ugr8r/fangdajing.png" width="20px" height="20px"> </div> </div> </div> </nav> </header> <!-- 宣传图片 --> <section class="banner"> <img src="image/banner1.jpg"> <div class="center-warp"> <a href="#" class="leftbtn"></a> <a href="#" class="rightbtn"></a> <nav class="banner-nav"> <ul> <li class="rmcfd"> <dl> <dt>热门出发地</dt> <dd> <em>北京</em> <em>上海</em> <em>广深</em> <em>西南</em> <em>国内其他</em> </dd> </dl> </li> <li class="gat"> <dl> <dt>港澳台 国内</dt> <dd> <em href="#">香港</em> <em href="#">澳门</em> <em href="#">台湾</em> <em href="#">国内其他</em> </dd> </dl> </li> <li class="rb"> <dl> <dt>日本 韩国</dt> <dd> <em>东京</em> <em>大阪</em> <em>冲绳</em> <em>北海道</em> <em>福冈</em> </dd> </dl> </li> <li class="dny"> <dl> <dt>东南亚 南亚</dt> <dd> <em>泰国</em> <em>新加坡</em> <em>马来西亚</em> <em>马尔代夫</em> </dd> </dl> </li> <li class="ozmz"> <dl> <dt>欧洲 美洲</dt> <dd> <em>英国</em> <em>法国</em> <em>美国</em> <em>加拿大</em> </dd> </dl> </li> <li class="axzdf"> <dl> <dt>澳新 中东非</dt> <dd> <em>澳大利亚</em> <em>新西兰</em> <em>迪拜</em> </dd> </dl> </li> </ul> <div class="menus-box"> <div class="menu"> <dl> <dt>国内热门城市</dt> <dd> <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="#">厦门</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="#">黄山</a> <a href="#">莫干山</a> <a href="#">新疆</a> <a href="#">北海</a> <a href="#">九华山</a> <a href="#">太原</a> <a href="#">张家口</a> </dd> </dl> <dl> <dt>国内热门景点</dt> <dd> <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="#">三亚日游</a> <a href="#">厦门鼓浪屿</a> <a href="#">千岛湖</a> <a href="#">呼伦贝尔草原</a> <a href="#">希拉穆仁草原</a> <a href="#">大理日游</a> <a href="#">杭州</a> <a href="#">重庆两江夜游船票</a> </dd> </dl> </div> <div class="menu"> <dl> <dt>港澳台</dt> <dd> <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="#">台北101</a> <a href="#">台湾美食</a> </dd> </dl> </div> <div class="menu"> <dl> <dt>日本</dt> <dd> <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="#">JR pass</a> <a href="#">米其林餐厅</a> <a href="#">东京迪士尼</a> <a href="#">大阪环球影城</a> <a href="#">冲绳一日游</a> <a href="#">City Walk</a> <a href="#">西瓜卡</a> <a href="#">京都日游</a> <a href="#">和服体验</a> <a href="#">包车服务</a> <a href="#">富士山游</a> </dd> </dl> </div> <div class="menu current"> <dl> <dt>泰新马</dt> <dd> <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="#">吉隆坡</a> <a href="#">皇帝岛</a> <a href="#">泰国人妖</a> <a href="#">泰国丛林飞跃</a> <a href="#">泰国spa按摩</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> </dd> </dl> <dl> <dt>东南亚</dt> <dd> <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="#">文莱</a> <a href="#">蓝梦岛</a> <a href="#">巴厘岛</a> <a href="#">SPA</a> <a href="#">网红漂浮下午茶</a> <a href="#">珍珠岛游乐园</a> <a href="#">富国岛浮潜海钓</a> <a href="#">吴哥窟</a> <a href="#">西哈努克</a> </dd> </dl> <dl> <dt>南亚 西亚</dt> <dd> <a href="#">马尔代夫</a> <a href="#">斯里兰卡</a> <a href="#">印度</a> <a href="#">尼泊尔</a> <a href="#">格鲁吉亚阿塞拜疆</a> <a href="#">亚美尼亚</a> </dd> </dl> </div> <div class="menu"> <dl> <dt>欧洲</dt> <dd> <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="#">捷克</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="#">雷克雅未克</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="#">伊斯坦布</a> <a href="#">尔阿尔罕布拉宫</a> <a href="#">唐顿庄园</a> <a href="#">埃菲尔铁塔</a> <a href="#">凡尔赛宫</a> <a href="#">北欧破冰船</a> <a href="#">极光之旅</a> <a href="#">英国天空岛</a> </dd> </dl> <dl> <dt>美洲</dt> <dd> <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="#">拉斯维加斯</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="#">迪士尼</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> </dd> </dl> </div> <div class="menu"> <dl> <dt>澳新 南太平洋</dt> <dd> <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="#">悉尼热气球</a> <a href="#">水上飞机</a> <a href="#">海港大桥</a> <a href="#">皇后镇霍比特人村</a> <a href="#">怀托莫萤火虫洞</a> <a href="#">米尔福德峡湾</a> <a href="#">新西兰滑雪</a> <a href="#">瓦纳卡</a> </dd> </dl> <dl> <dt>中东非</dt> <dd> <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="#">约旦</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="#">纳米比亚</a> </dd> </dl> </div> </div> </nav> </div> </section> <section class="hot-ads clearfix"> <div class="center-warp"> <ul> <li> <a href="#"> <img src="image/small01.png"> </a> </li> <li> <a href="#"> <img src="image/small02.png"> </a> </li> <li> <a href="#"> <img src="image/small03.png"> </a> </li> <li> <a href="#"> <img src="image/small04.png"> </a> </li> </ul> </div> </section> <section class="xxsw content-part"> <div class="center-warp"> <div class="hd clearfix"> <h2>新鲜甩尾</h2> <em>每日不可不看的好货</em> </div> <ul> <li> <a href="#"> <div class="picbox"> <img src="image/xxsw1.png"> </div> <div class="wordbox"> 北京直飞马尔代夫6-7天往返含税机票(首都航空/售完为止)… </div> </a> </li> <li> <a href="#"> <div class="picbox"> <img src="image/xxsw2.png"> </div> <div class="wordbox"> [甩尾狂欢] 北京/天津直飞日本东京/大阪/冲绳/札幌/福冈4-7天往返含… </div> </a> </li> <li> <a href="#"> <div class="picbox"> <img src="image/xxsw3.png"> </div> <div class="wordbox"> [拒签全退][全国25城联运] 北京往返格鲁吉亚+阿塞拜疆7-30天自由行… </div> </a> </li> <li> <a href="#"> <div class="picbox"> <img src="image/xxsw4.png"> </div> <div class="wordbox"> [樱花季] 北京直飞东京/大阪/名古屋/冲绳/札幌/福冈/仙台2-30天往返 </div> </a> </li> <li> <a href="#"> <div class="picbox"> <img src="image/xxsw5.png"> </div> <div class="wordbox"> [品质小团/快速确认] 新西兰福克斯冰川直升机观光+冰川徒步（提供… </div> </a> </li> <li> <a href="#"> <div class="picbox"> <img src="image/xxsw6.png"> </div> <div class="wordbox"> [北欧破冰船] 芬兰+瑞典极地探险号破冰船活动+冰上漂浮+瑞典小… </div> </a> </li> <li> <a href="#"> <div class="picbox"> <img src="image/xxsw7.png"> </div> <div class="wordbox"> [指定班期特惠][全程中文伴游] 摩洛哥全景深度10日游（卡萨进出… </div> </a> </li> <li> <a href="#"> <div class="picbox"> <img src="image/xxsw8.png"> </div> <div class="wordbox"> 马来西亚天空之镜+河口赏鹰+夜游萤火虫+寻找蓝眼泪（马来西亚瓜拉雪… </div> </a> </li> </ul> </div> </section> <section class="jjzyx content-part"> <div class="center-warp"> <div class="hd clearfix"> <h2>机酒自由行</h2> <em>挑选全球机票、酒店、邮轮等旅行产品</em> <nav> <ul> <li class="curret"><a href="#">近期好货</a></li> <li class="curret"><a href="#">新品聚会</a></li> <li class="curret"><a href="#">定制游</a></li> <li class="curret"><a href="#">国内推荐</a></li> <li class="curret"><a href="#">优惠机票</a></li> <li class="curret"><a href="#">热门海岛</a></li> <li class="curret"><a href="#">热卖签证</a></li> </ul> </nav> </div> <div class="bd"> <ul> <li class="big-grid"> <a href="#"> <img src="image/jjzyx1.png"> <span class="tag">机票</span> <div class="info"> <p>[樱花季]天津直飞东京/大阪/名古屋/冲绳/札幌2-30天往返</p> <p>含税机票【甩尾/多团期】</p> </div> </a> </li> <li class="pro-grid"> <a href="#"> <div class="picbox"> <span class="tag">跟团游</span> <img src="image/jjzyx2.png"> </div> <div class="wordbox"> 北京/上海/南京/杭州直飞巴厘岛5-7天往返含税机票(赠送旅游意外险… </div> </a> </li> <li class="pro-grid"> <a href="#"> <div class="picbox"> <span class="tag">机票</span> <img src="image/jjzyx3.png"> </div> <div class="wordbox"> 北京/天津直飞日本东京/大阪/东阪/福冈/名古屋冲绳/北海道4-7天往返… </div> </a> </li> <li class="pro-grid"> <a href="#"> <div class="picbox"> <span class="tag">机票</span> <img src="image/jjzyx4.png"> </div> <div class="wordbox"> [樱花季] 北京/天津直飞东京/大阪/名古屋/福冈/广岛/北海道/冲绳往返… </div> </a> </li> <li class="pro-grid"> <a href="#"> <div class="picbox"> <span class="tag">机票</span> <img src="image/jjzyx5.png"> </div> <div class="wordbox"> 杭州/上海/宁波/义乌直飞越南芽庄/岘港4-6天往返含税机票(20KG行… </div> </a> </li> <li class="pro-grid"> <a href="#"> <div class="picbox"> <span class="tag">机票</span> <img src="image/jjzyx6.png"> </div> <div class="wordbox"> [赠自由行礼包] 上海/杭州/南京/合肥/宁波/徐州直飞日本东京/大阪… </div> </a> </li> <li class="more-grid"> <a href="#"></a> <p>查看更多</p> <p>机酒自由行产品</p> <span class="iconfont"> <img src="image/icon_x2vd2ugr8r/youjiantou.png"> </span> <ul> <li>机票</li> <li>酒店</li> <li>机+酒</li> <li>游轮</li> </ul> </a> </li> </ul> </div> </div> </section> <section class="ddwl content-part"> <div class="center-warp"> <div class="hd clearfix"> <h2>当地玩乐</h2> <em>像当地人一样，体验本土的吃喝玩乐</em> <nav> <ul> <li class="curret"> <a href="#">国内</a> </li> <li > <li class="curret"> <a href="#">日本</a> </li> <li class="curret"> <a href="#">瑞士</a> </li> <li class="curret"> <a href="#">新西兰</a> </li> <li class="curret"> <a href="#">澳大利亚</a> </li> <li class="curret"> <a href="#">柬埔寨</a> </li> <li class="curret"></li> <a href="#">泰国</a> </li> </ul> </nav> </div> <div class="bd"> <div class="col"> <a href="#"> <div class="bigpicbox"> <img src="image/ddwl1.png"> <div class="info"> <p class="proname">[亲子佳选]泰国清迈夜间动物园/Night Safari（可选接送；导游；长颈鹿餐厅）</p> <div class="button clearfix"> <p class="tag">城市玩乐</p> <p class="price"><strong>199</strong>元起</p> </div> </div> </div> </a> <a href="#"> <div class="grid"> <a href="#"> <div class="picbox"> <img src="image/ddwl2.png"> </div> <div class="wordbox"> <p>[樱花季] 北京/天津直飞东京/大阪/名古屋/福冈/广岛/北海道/冲绳往返…</p> </div> </a> </div> </a> </div> <div class="col"> <div class="grid"> <div class="picbox"> <img src="image/ddwl3.png"> </div> <div class="wordbox"> <p>[网红新选] 泰国清迈黑白蓝庙一日游清莱黑庙 白庙 蓝庙 温泉驿站中文导游+酒店接送+餐赠小…</p> </div> </div> <div class="grid"> <div class="picbox"> <img src="image/ddwl4.png"> </div> <div class="wordbox"> <p>[网红新选] 泰国清迈黑白蓝庙一日游清莱黑庙 白庙 蓝庙 温泉驿站中文导游+酒店接送+餐赠小…</p> </div> </div> <div class="grid"> <div class="picbox"> <img src="image/ddwl5.png"> </div> <div class="wordbox"> <p>享行之旅|泰国苏梅岛一日游 越野车丛林环岛之旅 骑大象纳蒙瀑布</p> </div> </div> </div> <div class="col"> <div class="grid"> <div class="picbox"> <img src="image/ddwl6.png"> </div> <div class="wordbox"> <p>[可接急单] 泰国普吉岛西蒙Simon人妖秀门票VIP专座近距离与人妖互动合影…</p> </div> </div> <div class="more-grid"> <a href="#"> <p>查看更多</p> <p>当地玩乐产品</p> </a> <span class="iconfont"> <img src="image/icon_x2vd2ugr8r/youjiantou.png"> </span> <ul> <li><a href="#">WiFi/电话卡</a></li> <li><a href="#">交通票券</a></li> <li><a href="#">景点门票</a></li> <li><a href="#">特色体验</a></li> </ul> </div> </div> </div> </div> </section> <!-- 特色当地体验 --> <section class="tsddty content-part"> <div class="conter-warp"> <div class="hd"> <h2>特色当地体验</h2> </div> <div class="bd"> <ul> <li class="pro-grid"> <a href="#"> <div class="picbox"> <img src="image/tsddty1.png"> </div> <div class="wordbox"> <p class="proname">香港迪士尼乐园门票(一日 / 两日) - 无需换票扫码入园）</p> <p> <span class="score">★4.8</span> <span class="comment">（92833评价)2334.69k 人参加过</span> </p> </div> </a> </li> <li class="pro-grid"> <a href="#"> <div class="picbox"> <img src="image/tsddty2.png"> </div> <div class="wordbox"> <p class="proname">罗马金宫剧场人妖秀</p> <p> <span class="score">★4.6</span> <span class="comment">（92833评价)2334.69k 人参加过</span> </p> </div> </a> </li> <li class="pro-grid"> <a href="#"> <div class="picbox"> <img src="image/tsddty3.png"> </div> <div class="wordbox"> <p class="proname">京都和服体验 - 梦馆</p> <p> <span class="score">★4.7</span> <span class="comment">（4,293条评价)50K+ 人参加过</span> </p> </div> </a> </li> <li class="pro-grid"> <a href="#"> <div class="picbox"> <img src="image/tsddty4.png"> </div> <div class="wordbox"> <p class="proname">英国巨石阵 & 温莎城堡 & 巴斯罗马浴场一日游</p> <p> <span class="score">★4.5</span> <span class="comment">（2,104条评价)20K+ 人参加过</span> </p> </div> </a> </li> </ul> </div> </div> </section> </body> </html>
相关代码：CSS
@font-face{
font-family: "pingFangSCRegular";
src:url(../font/PingFangSCRegular.ttf)format('truetype');
}
body{
font-family:"pingFangSCRegular";
}
.center-warp{
align-content: center;
margin:0 auto;
width: 1152px;
}
.clearfix{
overflow:hidden;
}
.clearfix::after{
content: '';
display: block;
clear: both;
overflow: hidden;
}
.tac{
text-align: center;
}
.center{
margin: 0 auto;
}
.db{
display: block;
}
.dib{
display: inline-block;
}
.top-box{
width:100%;
min-width:1152px;
height: 150px;
}
.top-box .dark-box{
width:100%;
height:32px;
position: relative;
background-color: #2a2a2a;
display: block;
}
.top-box .dark-box .core{
width:1152px;
height:32px;
left: 107px;
margin:0 auto;
}
.top-box .dark-box .core ul{
}
.top-box .dark-box .core>ul>li{
float: left;
margin-left: 18px;
text-align: center;
line-height: 32px;
}
.top-box .dark-box .core>ul>li a{
color:white;
}
.top-box .dark-box .core>ul>li.cli{
padding-right: 15px;
position: relative;
}
.top-box .dark-box .core>ul>li.cli>.menus{
background-color: white;
position: absolute;
top:29px;
left:0;
/* 可以压盖住别的内容 */
z-index:9999;
/* 隐藏 */
display: none;
box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.20);
padding:10px;
}
.top-box .dark-box .core>ul>li.cli .sqmenus{
width:110px;
}
.top-box .dark-box .core>ul>li.cli .sqmenus menus-list li{
height:20px;
line-height:20px;
}
.top-box .dark-box .core>ul>li.cli:hover>.menus{
display: block;
}
.top-box .dark-box .core>ul>li.cli .sqmenus .menus-list a{
font-size: 12px;
color:#1C1F21;
line-height: 20px;
}
.top-box .dark-box .core>ul>li.cli .menut{
width:76px;
background-color:white;
position: absolute;
top:30px;
left:0px;
/* 隐藏 */
display: none;
/* 使用z-index:9999;可以使该盒子将别的内容压盖住 */
z-index: 9999;
box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.20);
padding:10px;
}
.top-box .dark-box .core>ul>li.cli:hover .menut{
/* 一碰就显示 */
display: block;
}
.top-box .dark-box .core>ul>li.cli .menut .sqmenut{
width:76px;
}
.top-box .dark-box .core>ul>li.cli .menut .menut-list a{
font-size: 12px;
color:#1C1F21;
height:20px;
line-height: 20px;
}
.top-box .dark-box .core>ul>li.cli .menur{
width:64px;
position: absolute;
top:30px;
left:40px;
background-color: white;
box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.20);
z-index: 9999;
display: none;
}
.top-box .dark-box .core>ul>li.cli:hover .jdmenur{
width:64px;
display: block;
}
.top-box .dark-box .core>ul>li.cli .jdmenur .menur-list a{
font-size: 12px;
height:5px;
line-height:5px;
color:#1C1F21;
}
.top-box .dark-box .core>ul>li.cli .jdmenur .menur-list a:hover{
color:#20BD9A;
}
.top-box .dark-box .core>ul>li.cli .menut .menut-list a:hover{
color:#20BD9A;
}
.top-box .dark-box .core>ul>li.cli .sqmenus .menus-list a:hover{
color:#20BD9A;
}
.top-box .dark-box .core>ul>li.cli .away{
width:12px;
height: 12px;
position:absolute;
top:50%;
right:0px;
margin-top:-6px;
transition:.2s ease 0s;
}
.top-box .dark-box .core>ul>li.cli .away i{
position:absolute;
width:8px;
height:8px;
left:2px;
top:1.5px;
background-color: white;
transform: rotate(45deg);
}
.top-box .dark-box .core>ul>li.cli .away b{
position: absolute;
width:8px;
height:8px;
left:2px;
top:-2px;
transform: rotate(45deg);
background-color:#2a2a2a;
}
.top-box .dark-box .core>ul>li.cli:hover .away{
transform: rotate(180deg);
}
.top-box .dark-box .right-layout{
width:300px;
height:32px;
position: absolute;
right:0px;
bottom:0px;
}
.top-box .dark-box .right-layout>ul>li{
float:left;
margin-right:18px;
line-height: 32px;
}
.top-box .dark-box .right-layout>ul>li>a{
color: white;
}
.top-box .dark-box .right-layout>ul>li>a>img{
width:20px;
height:20px;
line-height: 32px;
padding-top:7px;
}
.top-box .dark-box .right-layout>ul>li.lis p{
width:1px;
height:18px;
position: absolute;
bottom: 4px;
background-color:#D8D8D8;
}
.top-box .dark-box .right-layout>ul>li:nth-child(3){
margin-left: 16px;
}
.top-box .green-box{
height:40px;
background-color: #20BD9A;
}
.top-box .green-box .layout{
width:1115px;
height:20px;
margin:0 auto;
}
.top-box .green-box .layout ul li{
float: left;
margin-right:18px;
position: relative;
}
.top-box .green-box .layout ul li>a{
font-size: 16px;
line-height: 40px;
color: white;
}
.top-box .green-box .layout ul li .qb .qb-list .lit a h1{
float:left;
padding-left: 5px;
margin-right:90px;
font-size: 14px;
font-weight:bold;
}
.top-box .green-box .layout ul li.have{
padding-right: 16px;
}
.top-box .green-box .layout ul li.have p{
width:0px;
height:0px;
border:6px solid transparent;
position: absolute;
right:0px;
top:50%;
margin-top: -3px;
border-top-color:white;
}
.top-box .green-box .layout ul li.have p:hover{
transform: rotate(90deg);
transition: .5s ease 0s;
}
.top-box .green-box .layout ul li.have .qb{
position: absolute;
left:0px;
top:35px;
background-color:white;
z-index:9999;
box-shadow:0 4px 8px 0 rgba(0, 0, 0, 0.20);
display:none;
}
.top-box .green-box .layout ul li.have:hover .qb{
display: block;
}
.top-box .green-box .layout ul li.have .qbs{
width:140px;
}
.top-box .green-box .layout ul li.have .qb .qb-list a{
font-size: 12px;
color:#1C1F21;
}
.top-box .green-box .layout ul li.have .qb .qb-list dd a{
float: left;
margin:5px;
}
.top-box .green-box .layout ul li.have .qb .qb-list a:hover{
color:#20BD9A;
}
.top-box .green-box .layout ul li.have .gt{
width:60px;
background-color: white;
box-shadow:0 4px 8px 0 rgba(0, 0, 0, 0.20);
position: absolute;
left:5px;
top:34px;
z-index:9999;
display: none;
}
.top-box .green-box .layout ul li.have:hover .gt{
display: block;
}
.top-box .green-box .layout ul li.have .gt .gtss a h1{
float: left;
left:0px;
font-size: 14px;
font-weight: bold;
margin-right: 20px;
}
.top-box .green-box .layout ul li.have .gt>dl dd a{
float: left;
margin-right:5px;
font-size: 12px;
}
.top-box .green-box .layout ul li.have .gt>dl dd:hover a{
color:#20BD9A;
}
.top-box .green-box .layout ul li.have .dd{
width:172px;
background-color: white;
position: absolute;
left:0px;
top:35px;
z-index: 9999;
box-shadow:0 4px 8px 0 rgba(0, 0, 0, 0.20);
display: none;
}
.top-box .green-box .layout ul li.have:hover .dd{
display: block;
}
.top-box .green-box .layout ul li.have .dd>.ddwl dt a h1{
font-size:14px;
font-weight: bold;
float: left;
margin-left:5px;
margin-right:100px;
}
.top-box .green-box .layout ul li.have .dd>.ddwl dt a h1:hover{
color:#20BD9A;
}
.top-box .green-box .layout ul li.have .dd>.ddwl dd a{
font-size: 12px;
float: left;
margin-left: 5px;
}
.top-box .green-box .layout ul li.have .dd>.ddwl dd a:hover{
color:#20BD9A;
}
.top-box .green-box .layout ul li.have .sd{
width:118px;
position: absolute;
left:0px;
top:33px;
background-color: white;
box-shadow:0 4px 8px 0 rgba(0, 0, 0, 0.20);
z-index: 9999;
display: none;
}
.top-box .green-box .layout ul li.have:hover .sd{
display: block;
}
.top-box .green-box .layout ul li.have .sd .sdly dt a h1{
font-size: 14px;
font-weight: bold;
float: left;
margin-right:90px;
}
.top-box .green-box .layout ul li.have .sd dl dd a{
font-size: 12px;
float:left;
left:5px;
}
.top-box .green-box .layout ul li.have .sd dl a:hover{
color:#20BD9A;
}
.top-box .logo-box{
height:78px;
position: relative;
}
.top-box .logo-box .log{
width:1000px;
height:78px;
position: absolute;
left:50%;
left:190px;
}
.top-box .logo-box .logo{
width:120px;
height:36px;
position: absolute;
}
.top-box .logo-box .logo h1{
font-size: 24px;
color: #20BD9A;
text-align: center;
font-weight:bold;
margin-top: 21px;
}
.top-box .logo-box .Search-box{
width:405px;
height: 30px;
position: absolute;
left:140px;
margin-top: 21px;
}
.top-box .logo-box .Search-box input{
width:349px;
height:30px;
padding-right: 20px;
}
.top-box .logo-box .Search-box .magnifier{
width:30px;
height:30px;
background-color: #20BD9A;
float:right;
margin-right:26px;
position: relative;
}
.top-box .logo-box .Search-box .magnifier img{
position: absolute;
margin-left:5px;
margin-top:5px;
}
.banner{
position: relative;
}
.banner img{
width:100%;
/* 使用一个新属性min-width表示限制属性的最小宽度 */
min-width:1152px;
/* 图片可能和盒子会产生一些缝隙，此时可以运用一些小技巧 */
/* 意思为垂直居中，这是一个小技巧，添加上就不会拥有小缝细了 */
vertical-align: middle;
}
.banner .center-warp{
position: absolute;
width:1152px;
top:0;
left:0;
left:50%;
margin-left:-576px;
/* 注意这里的100%，也很重要如果一旦省去他的height将会是0
它的盒子所设计的16.6%将会失去意义
*/
height:100%;
}
.banner .center-warp .banner-nav{
height:100%;
}
.banner .center-warp .banner-nav>ul{
/* 注意这里的100%，也很重要如果一旦省去他的height将会是0
它的盒子所设计的16.6%将会失去意义
*/
height:100%;
}
.banner .center-warp .banner-nav>ul>li{
height: 16.66%;
width:296px;
background-color:rgba(0, 0, 0, 0.45);
border-bottom: 1px solid #9e9e9e;
/* box-sizing:border-box; 属性的作用就是height属性是盒子的总高度，这种情况盒子的高度使用百分数写的盒子的边框*/
box-sizing: border-box;
}
.banner .center-warp .banner-nav>ul>li:last-child{
border-bottom:none;
}
.banner .center-warp .leftbtn{
position: absolute;
width:28px;
height:44px;
top:50%;
left:-38px;
margin-top:-22px;
background-color: orange;
}
.banner .center-warp .rightbtn{
position: absolute;
width:28px;
height:44px;
top:50%;
right:-38px;
margin-top:-22px;
background-color: orange;
}
.banner .center-warp .leftbtn:hover,.banner .center-warp .righttbtn:hover{
/* 透明度 */
opacity:0.8;
}
.banner .center-warp .banner-nav>ul>li{
position: relative;
}
.banner .center-warp .banner-nav>ul>li dl{
position: absolute;
height:48px;
top:50%;
left:42px;
margin-top:-24px;
color:white;
}
.banner .center-warp .banner-nav>ul>li dl dt{
font-size:18px;
line-height:26px;
height:26px;
}
.banner .center-warp .banner-nav>ul>li dl dd{
font-size:16px;
line-height:22px;
height:22px;
}
.banner .center-warp .banner-nav>ul>li dl::before{
content:'';
position: absolute;
background-color: orange;
top:10px;
left:10px;
}
.banner .center-warp .banner-nav>ul>li.rmcfd::before{
width:22px;
height:18px;
background-position:;
margin-top:-9px;
}
.banner .center-warp .banner-nav>ul>li.gat::before{
width:18px;
height:21px;
background-position: ;
margin-top: -10.5px;
left:13px;
}
.banner .center-warp .banner-nav>ul>li.rb::before{
width:24px;
height:19px;
background-position: ;
margin-top:-9.5px;
}
.banner .center-warp .banner-nav>ul>li.dny::before{
width:18px;
height:19px;
background-position: ;
margin-top:-9.5px;
left:12px;
}
.banner .center-warp .banner-nav>ul>li.ozmz::before{
width:20px;
height:14px;
margin-top:-7px;
left:11px;
}
.banner .center-warp .banner-nav>ul>li.axzdf::before{
width:18px;
height:17px;
background-position:;
margin-top:-8.5px;
left:12px;
}
.banner .center-warp .banner-nav .menus-box .menu{
display: none;
position: absolute;
left:296px;
top:0px;
width:356px;
height:100%;
background-color: rgba(0,0,0,.63);
padding:16px;
/* 加上box-sizing属性之后，height:100%;盒子的总高度 */
/* 就不需要减padding了，因为百分比怎么减padding呀？ */
box-sizing: border-box;
color:white;
}
.banner .center-warp .banner-nav .menus-box .menu.current{
display: block;
}
.banner .center-warp .banner-nav .menus-box .menu a{
color:white;
}
.banner .center-warp .banner-nav .menus-box .menu dl{
margin-bottom: 16px;
}
.banner .center-warp .banner-nav .menus-box .menu dl dt{
line-height:30px;
font-size:18px;
}
.banner .center-warp .banner-nav .menus-box .menu dl dd{
line-height:25px;
font-size:15px;
}
.hot-ads{
margin-top:32px;
margin-bottom: 32px;
overflow: hidden;
}
.hot-ads .center-warp ul li{
float: left;
width:264px;
height:110px;
margin-right:32px;
}
.hot-ads ul li:last-child{
margin-right:0px;
}
.xxsw{
height:698px;
padding-top: 40px;
background-color: #F7F7F7;
}
.xxsw .hd{
margin-bottom: 32px;
}
.xxsw .hd h2{
float: left;
font-size: 36px;
font-weight: bold;
color:#1C1F21;
}
.xxsw .hd em{
float: left;
position: relative;
top:20px;
left:10px;
color:#1C1F21;
}
.xxsw ul li{
float: left;
width:264px;
height:270px;
background-color:white;
margin-bottom:32px;
margin-right:32px;
}
.xxsw ul li:nth-child(4n){
margin-right: 0;
}
.xxsw ul li .wordbox{
padding:15px;
color:#1C1F21;
font-size: 14px;
}
.xxsw ul li:hover{
transition: .5s ease 0s;
transform: scale(1.1,1.1);
box-shadow:0 8px 16px 0 rgba(0, 0, 0, 0.20);
}
.jjzyx{
height:698px;
padding-top:40px;
}
.content-part h2{
font-size: 36px;
font-weight: bold;
color:#1C1F21;
}
.content-part em{
position: relative;
left:10px;
top:22px;
color:#1C1F21;
}
.jjzyx .hd h2{
float:left;
}
.content-part .hd nav{
float:right;
width:570px;
}
.content-part .hd nav ul{
padding:16px;
}
.content-part .hd nav ul li{
float:left;
margin-right: 16px;
}
.content-part .hd nav ul li:last-child{
margin:0px;
}
.content-part .hd nav ul li a{
color:rgba(0,0,0,.85);
}
.content-part .hd nav ul li.curret a:hover{
margin-bottom: 4px;
color:#20BD9A;
border-bottom:4px solid #20BD9A;
}
.content-part .bd>ul>li{
float: left;
margin-right:32px;
margin-bottom:32px;
box-shadow:0 4px 16px 0 rgba(0, 0, 0, 0.20);
}
.content-part .bd>ul>li:hover{
box-shadow:0 8px 16px 0 rgba(0, 0, 0, 0.20);
transform: scale(1.1,1.1);
transition:.5s ease 0s;
}
.content-part .bd>ul>li:nth-child(3),.jjzyx .bd ul li:nth-child(7){
margin-right:0px;
}
.content-part .bd{
padding-top:32px;
}
.content-part .big-grid{
width:560px;
height:270px;
position: relative;
}
.content-part .big-grid .info{
position: absolute;
bottom:0px;
left:0px;
width:560px;
height:103px;
background-color:rgba(0, 0, 0, 0.55);
color:white;
padding:30px 26px;
box-sizing: border-box;
line-height: 26px;
}
.content-part .big-grid .tag{
position: absolute;
width:74px;
height:40px;
bottom:103px;
left:0px;
color:white;
background-color:rgba(0, 0, 0, 0.55);
text-align: center;
line-height: 40px;
}
.content-part .pro-grid .picbox .tag{
position: absolute;
width:74px;
height:40px;
bottom:103px;
left:0px;
color:white;
background-color:rgba(0, 0, 0, 0.55);
text-align: center;
line-height: 40px;
}
.content-part .pro-grid{
width:264px;
height:270px;
}
.content-part .pro-grid .wordbox{
padding:14px;
font-size:14px;
color:#1C1F21;
line-height: 26px;
}
.content-part .pro-grid .picbox{
position: relative;
height:184px;
}
.content-part .pro-grid .picbox .tag{
bottom:0px;
}
.content-part .more-grid{
width:264px;
height:270px;
background-image: linear-gradient(180deg, #34E3BC 0%, #15AF7A 98%);
padding-top:46px;
box-sizing: border-box;
position: relative;
}
.content-part .bd ul li.more-grid p{
text-align: center;
color:white;
line-height: 24px;
font-size: 14px;
}
.content-part .bd ul li.more-grid .iconfont img{
position: absolute;
width:48px;
height:48px;
left:50%;
margin-left:-24px;
top:118px;
}
.content-part .bd ul li.more-grid ul{
margin-top:83px;
}
.content-part .bd>ul>li.more-grid ul{
margin-top:112px;
padding-left: 42px;
}
.content-part .bd ul li.more-grid ul li{
float: left;
color:white;
border-right: 1px solid white;
padding:0 6px;
height:16px;
line-height:16px;
font-size: 14px;
}
.ontent-part .bd ul li.more-grid ul li:last-child{
border-right: none;
}
.ddwl{
height:546px;
padding-top:40px;
background-color: #f7f7f7;
}
.ddwl .center-warp .hd h2{
float: left;
}
.ddwl .hd nav{
width:416px;
}
.ddwl .bd .col{
float:left;
width:364px;
height:480px;
margin-right: 30px;
}
.ddwl .bd{
padding-top:32px;
}
.ddwl .bd .col:last-child{
margin-right:0px;
}
.ddwl .bd .col .bigpicbox{
width:364px;
height:270px;
position: relative;
margin-bottom:32px;
}
.ddwl .bd .col .bigpicbox .info{
width:364px;
height:104px;
position:absolute;
bottom:0;
left:0px;
background-color:rgba(0, 0, 0, 0.55);
padding:21px 17px 0px;
box-sizing: border-box;
color:white;
font-size:14px;
line-height:22px;
}
.ddwl .bd .col .bigpicbox .info .button{
padding-top:6px;
}
.ddwl .bd .col .bigpicbox .info .button .tag{
float:left;
}
.ddwl .bd .col .bigpicbox .info .price{
float:right;
}
.ddwl .bd .col .bigpicbox .info .price strong{
color:#20BD9A;
}
.ddwl .bd .col .grid{
width:364px;
height:120px;
background-color: white;
margin-bottom:30px;
}
.ddwl .bd .col .bigpicbox:hover{
transition:.5s ease 0s;
transform: scale(1.1,1.1);
}
.ddwl .bd .col .grid:hover{
transition:.5s ease 0s;
box-shadow:0 8px 16px 0 rgba(0, 0, 0, 0.20);
transform: scale(1.1,1.1);
}
.ddwl .bd .col .grid .picbox{
width:120px;
height:120px;
float: left;
left:0px;
}
.ddwl .bd .col .grid .wordbox{
width:244px;
height:120px;
float:right;
padding:26px 18px;
line-height: 22px;
font-size: 14px;
box-sizing: border-box;
}
.ddwl .bd .col .more-grid{
width:364px;
height:264px;
background-image: linear-gradient(180deg, #FF6374 1%, #FF7368 98%);
box-shadow: 0 4px 8px 0 rgba(0,0,0,0.08);
position: relative;
}
.ddwl .bd .col .more-grid:hover{
box-shadow: 0 4px 8px 0 rgba(0,0,0,0.08);
}
.ddwl .bd .col .more-grid a{
text-align: center;
font-size: 14px;
color:white;
line-height: 22px;
}
.ddwl .bd .col .more-grid a p:nth-child(2){
margin-bottom: 28px;
}
.ddwl .bd .col .more-grid .iconfont img{
width:48px;
height:48px;
position: absolute;
left:50%;
margin-left: -24px;
margin-bottom:32px;
}
.ddwl .bd .col .more-grid ul{
position: absolute;
bottom:46px;
margin:0px 22px 0px 27px;
}
.ddwl .bd .col .more-grid ul li{
float: left;
text-align: center;
line-height: 22px;
padding:0px 4px 0px 4px;
border-right: 1px solid white;
color:white;
}
.ddwl .bd .col .more-grid ul li a:hover{
color:#20BD9A;
}
.ddwl .bd .col .more-grid ul li:last-child{
border-right: none;
padding-right:0px;
}
.tsddty{
height:456px;
}
.tsddty .conter-warp{
padding-top:40px;
}
.tsddty .conter-warp .hd h2{
text-align: center;
}
.content-part .conter-warp .bd ul li{
margin-right: 32px;
width:264px;
height:290px;
}相关代码：bese.css
.clearfix{
overflow: hidden;
}
.clearfix::after{
content: '';
display: block;
clear: both;
overflow: hidden;
}
.tac{
text-align: center;
}
.center{
margin: 0 auto;
}
.db{
display: block;
}
.dib{
display: inline-block;
}相关代码：reset.css
/*
YUI 3.18.1 (build f7e7bcb)
Copyright 2014 Yahoo! Inc. All rights reserved.
Licensed under the BSD License.
http://yuilibrary.com/license/
*/
html{color:#000;background:#FFF}body,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,pre,code,form,fieldset,legend,input,textarea,p,blockquote,th,td{margin:0;padding:0}table{border-collapse:collapse;border-spacing:0}fieldset,img{border:0}address,caption,cite,code,dfn,em,strong,th,var{font-style:normal;font-weight:normal}ol,ul{list-style:none}caption,th{text-align:left}h1,h2,h3,h4,h5,h6{font-size:100%;font-weight:normal}q:before,q:after{content:''}abbr,acronym{border:0;font-variant:normal}sup{vertical-align:text-top}sub{vertical-align:text-bottom}input,textarea,select{font-family:inherit;font-size:inherit;font-weight:inherit;*font-size:100%}legend{color:#000}#yui3-css-stamp.cssreset{display:none}
a{text-decoration: none;}写回答
1回答
-
好帮手慕久久
2022-03-17
同学你好，由于版心类名写错了，所以居中样式没添加上：
应该是center-warp：
祝学习愉快！
0
相似问题