?HTML代碼
<!DOCTYPE html>
<html lang="en"><head><meta charset="UTF-8"><meta name="viewport" content_lizhongyu="width=device-width, initial-scale=1.0"><title>小兔鮮兒-新鮮、惠民、快捷</title><link rel="stylesheet" href="./css/index.css">
</head><body><!-- 黑色導航欄 --><nav class="one_black-bar_zhengboming"><div class="content_zhengboming"><p class="text_zhengboming">請先登錄</p><p class="line_zhengboming">|</p><p class="text_zhengboming">免費注冊</p><p class="line_zhengboming">|</p><p class="text_zhengboming">我的訂單</p><p class="line_zhengboming">|</p><p class="text_zhengboming">會員中心</p><p class="line_zhengboming">|</p><p class="text_zhengboming">購物中心</p><p class="line_zhengboming">|</p><p class="text_zhengboming">在線客服</p><p class="line_zhengboming">|</p><p class="text_zhengboming">手機版</p></div></nav><!-- 白色導航欄 --><div class="two_white-bar_zhengboming"><div class="logo_zhengboming"></div><div class="center_zhengboming"><a class="item_zhengboming">首頁</a><a class="item_zhengboming">生鮮</a><a class="item_zhengboming">美食</a><a class="item_zhengboming">餐廚</a><a class="item_zhengboming">電器</a><a class="item_zhengboming">居家</a><a class="item_zhengboming">洗護</a><a class="item_zhengboming">孕嬰</a><a class="item_zhengboming">服裝</a></div><!-- 搜索框 --><div class="search_zhengboming"><div class="icon_zhengboming"></div><input type="text" placeholder="搜一搜"></div><!-- 購物車圖標 --><div class="card_zhengboming"><!-- 右上角提示信息 --><div class="tip_zhengboming">2</div></div></div><!-- banner布局 --><div class="three_banner_zhengboming"><div class="left_zhengboming"><div class="item_zhengboming"><span class="category_zhengboming">生鮮</span><span class="description_zhengboming">水果 蔬菜</span><div class="arrow_zhengboming">></div></div><div class="item_zhengboming"><span class="category_zhengboming">美食</span><span class="description_zhengboming">面點 干果</span><div class="arrow_zhengboming">></div></div><div class="item_zhengboming"><span class="category_zhengboming">餐廚</span><span class="description_zhengboming">數碼產品</span><div class="arrow_zhengboming">></div></div><div class="item_zhengboming"><span class="category_zhengboming">電器</span><span class="description_zhengboming">床品 四件套 被枕</span><div class="arrow_zhengboming">></div></div><div class="item_zhengboming"><span class="category_zhengboming">居家</span><span class="description_zhengboming">奶粉 杬貝 補食</span><div class="arrow_zhengboming">></div></div><div class="item_zhengboming"><span class="category_zhengboming">洗護</span><span class="description_zhengboming">滉茇 況馿 美牧</span><div class="arrow_zhengboming">></div></div><div class="item_zhengboming"><span class="category_zhengboming">孕嬰</span><span class="description_zhengboming">奶粉 玩貝</span><div class="arrow_zhengboming">></div></div><div class="item_zhengboming"><span class="category_zhengboming">服飾</span><span class="description_zhengboming"> 女裝 男裝</span><div class="arrow_zhengboming">></div></div><div class="item_zhengboming"><span class="category_zhengboming">雜貸</span><span class="description_zhengboming">戶外 圖書</span><div class="arrow_zhengboming">></div></div><div class="item_zhengboming"><span class="category_zhengboming">品牌</span><span class="description_zhengboming">品牌制造</span><div class="arrow_zhengboming">></div></div></div><!-- 右側小箭頭 --><div class="right_zhengboming"><div class="prev_btn_zhengboming">< </div><div class="next_btn_zhengboming">></div></div></div></div><!-- 新鮮好物 --><div class="four_xinxianhaowu_zhengboming"><div class="top_zhengboming"><div class="left_zhengboming"><div class="title_zhengboming">新鮮好物</div><div class="tip_zhengboming">新鮮出爐 品牌靠譜</div></div><div class="right_zhengboming">查看更多></div></div><!-- 新鮮好物內容 --><div class="content_zhengboming"><div class="item_zhengboming"><img src="/images/new_goods_1.jpg"><p class="name">睿米無線吸塵器 F8</p><p class="price">￥<span class="num">899</span></p></div><div class="item_zhengboming"><img src="/images/new_goods_2.jpg"><p class="name">智能環繞 3D 空調</p><p class="price">￥<span class="num">1299</span></p></div><div class="item_zhengboming"><img src="/images/new_goods_3.jpg"><p class="name">廣東軟軟襦米煲仔飯</p><p class="price">￥<span class="num">129</span></p></div><div class="item_zhengboming"><img src="/images/new_goods_4.jpg"><p class="name">羅西機械智能手表</p><p class="price">￥<span class="num">3399</span></p></div></div></div><!-- 生鮮 --><div class="five_shengxian_zhengboming"><!-- 生鮮頂部 --><div class="top_zhengboming"><div class="title_zhengboming">生鮮</div><div class="right_zhengboming"><div class="left_zhengboming"><div class="item_zhengboming active_zhengboming">水果</div><div class="item_zhengboming">蔬菜</div><div class="item_zhengboming">肉食蛋</div><div class="item_zhengboming">褲裝</div><div class="item_zhengboming">襯衫</div><div class="item_zhengboming">T恤</div><div class="item_zhengboming">內衣</div></div><div class="right_zhengboming">查看更多</div></div></div><!-- 生鮮內容 --><div class="content_zhengboming"><div class="left_zhengboming"></div><div class="right_zhengboming"><div class="item_zhengboming"><img src="/images/fresh_goods_1.jpg" alt=""><p>美膛 智利原味三文魚排 240g卷4片婆海鮮年皮</p><p>￥59</p><!-- 隱藏提示框 --><div class="hidden_zhengboming"><span>找相似</span><br><span>——————</span><br><span>發現更多寶貝></span></div></div><div class="item_zhengboming"><img src="/images/fresh_goods_2.jpg" alt=""><p>紅功尖 麻辣小龍蝦1.5kg 4.6樓J25.32只火銅食材</p><p>￥79</p><div class="hidden_zhengboming"><span>找相似</span><br><span>——————</span><br><span>發現更多寶貝></span></div></div><div class="item_zhengboming"><img src="/images/fresh_goods_3.jpg" alt=""><p>三都港 冷凍無公害黃花魚 700g 2條 美淘鮮水產</p><p>￥49</p><div class="hidden_zhengboming"><span>找相似</span><br><span>——————</span><br><span>發現更多寶貝></span></div></div><div class="item_zhengboming"><img src="/images/fresh_goods_4.jpg" alt=""><p>漁公碼頭 大連鮮食入味 即龠湃卷 遼整刺曲調味海</p><p>￥899</p><div class="hidden_zhengboming"><span>找相似</span><br><span>——————</span><br><span>發現更多寶貝></span></div></div><div class="item_zhengboming"><img src="/images/fresh_goods_5.jpg" alt=""><p>陸南白心火龍果4個裝標重里400-5509期鮮水果</p><p>￥20</p><div class="hidden_zhengboming"><span>找相似</span><br><span>——————</span><br><span>發現更多寶貝></span></div></div><div class="item_zhengboming"><img src="/images/fresh_goods_6.jpg" alt=""><p>廣西沃柑 新鮮水果 相播1.54g新鮮水栗</p><p>￥10</p><div class="hidden_zhengboming"><span>找相似</span><br><span>——————</span><br><span>發現更多寶貝></span></div></div><div class="item_zhengboming"><img src="/images/fresh_goods_7.jpg" alt=""><p>進口 牛油果 6個英 單果重約130-180g新鮮水用</p><p>￥50</p><div class="hidden_zhengboming"><span>找相似</span><br><span>——————</span><br><span>發現更多寶貝></span></div></div><div class="item_zhengboming"><img src="/images/fresh_goods_8.jpg" alt=""><p>泰國進口山竹5A股5000新鮮水果</p><p>￥60</p><div class="hidden_zhengboming"><span>找相似</span><br><span>——————</span><br><span>發現更多寶貝></span></div></div></div></div></div><!-- 最新專題 --><div class="fix_zhuanti_zhengboming"><div class="top_zhengboming"><div class="left_zhengboming">最新專題</div><div class="right_zhengboming">查看全部</div></div><!-- 最新專題內容 --><div class="content_zhengboming"><div class="item_zhengboming"><div class="img_zhengboming"><div class="info_zhengboming"><div class="left_zhengboming"><p>吃這些美食才不會辜負自己</p><p>餐廚起居洗護好物</p></div><div class="right_zhengboming">￥29.9起</div></div></div><!-- 最新專題底部 --><div class="bottom_zhengboming"><div class="left_zhengboming"><img src="/images/xin.png" width="20"></img><div>1220</div><img src="/images/show.png" width="20"></img><div>1800</div></div><div class="right_zhengboming"><img src="/images/liulan.png" width="20"></img><div>246</div></div></div></div><div class="item_zhengboming"><div class="img_zhengboming" style="background-image: url('/images/topic_goods_2.jpg');"><div class="info_zhengboming"><div class="left_zhengboming"><p>吃這些美食才不會辜負自己</p><p>餐廚起居洗護好物</p></div><div class="right_zhengboming">￥29.9起</div></div></div><div class="bottom_zhengboming"><div class="left_zhengboming"><img src="/images/xin.png" width="20"></img><div>1220</div><img src="/images/show.png" width="20"></img><div>1800</div></div><div class="right_zhengboming"><img src="/images/liulan.png" width="20"></img><div>246</div></div></div></div><div class="item_zhengboming"><div class="img_zhengboming" style="background-image: url('/images/topic_goods_3.jpg');"><div class="info_zhengboming"><div class="left_zhengboming"><p>吃這些美食才不會辜負自己</p><p>餐廚起居洗護好物</p></div><div class="right_zhengboming">￥29.9起</div></div></div><div class="bottom_zhengboming"><div class="left_zhengboming"><img src="/images/xin.png" width="20"></img><div>1220</div><img src="/images/show.png" width="20"></img><div>1800</div></div><div class="right_zhengboming"><img src="/images/liulan.png" width="20"></img><div>246</div></div></div></div></div></div><!-- 底部內容 --><div class="seven_bottom_zhengboming"><div class="top_zhengboming"><div class="item_zhengboming"><p class="title_zhengboming">貼心客服</p><div class="icon_zhengboming"><div class="left_zhengboming"><img src="/images/wx.png" alt="" width="30"><p>在線咨詢</p></div><div class="right_zhengboming"><img src="/images/wenhao.png" alt="" width="30"><p>問題處理</p></div></div></div><div class="item_zhengboming"><p class="title_zhengboming">公司詳情</p><div class="icon_zhengboming"><div class="left_zhengboming"><img src="/images/wx2.png" alt="" width="30"><p>官方賬號</p></div><div class="right_zhengboming"><img src="/images/wb.png" alt="" width="30"><p>公司微博</p></div></div></div><div class="item_zhengboming"><p class="title_zhengboming">獲取 APP</p><div class="icon_zhengboming"><div class="left_zhengboming"><img src="/images/qrcode.png" alt="" width="100%"></div><div class="tip_zhengboming"><p>掃碼下載</p><p>輕松獲取 APP</p><div class="btn_zhengboming">下載入口</div></div></div></div><div class="item_zhengboming"><p class="title_zhengboming">服務電話</p><div class="info_zhengboming"><p>500-1111-2222</p><p>周一至周六 9:00-17:00</p></div></div></div><!-- 底部中間部分 --><div class="center_zhengboming"><div class="item_zhengboming"><img src="/images/bottom1.png" alt=""><span>價格實惠</span></div><div class="item_zhengboming"><img src="/images/bottom2.png" alt=""><span>配送迅速</span></div><div class="item_zhengboming"><img src="/images/bottom3.png" alt=""><span>品質優良</span></div></div><!-- 底部下方部分 --><div class="footer_zhengboming"><p>公司介紹|幫助指南|售后保障|物流運輸|商務合作|搜索指南|友好鏈接</p><p>CopyRight @小兔鮮兒</p></div></div>
</body></html>CSS代碼
/* 黑色導航欄樣式 */
.one_black-bar_zhengboming{width: 1240px;height: 52px;background-color: #333;position: relative;margin: 5px auto;
}
/* 黑色導航欄內容樣式 */
.one_black-bar_zhengboming .content_zhengboming {position: absolute;right: 10%;line-height: 52px;display: flex;align-items: center;height: 52px;
}
/* 黑色導航欄文本樣式 */
.one_black-bar_zhengboming .content_zhengboming .text_zhengboming {color: #dcdcdc;margin: 0 10px;cursor: pointer;
}
/* 黑色導航欄字體移入樣式 */
.one_black-bar_zhengboming .content_zhengboming .text_zhengboming:hover {color: #27BA9B;
}
/* 黑色導航欄線條顏色 */
.one_black-bar_zhengboming .content_zhengboming .line_zhengboming {color: #666;
}
/* 白色導航欄樣式 */
.two_white-bar_zhengboming {width: 1240px;height: 100px;display: flex;margin: 5px auto;align-items: center;
}
/* 白色導航欄logo樣式 */
.two_white-bar_zhengboming .logo_zhengboming {width: 207px;height: 70px;background-image: url('/images/logo.png');background-size: 100% 100%;
}
/* 白色導航欄中間布局 */
.two_white-bar_zhengboming .center_zhengboming {width: 756px;height: 70px;display: flex;justify-content: space-around;
}
.two_white-bar_zhengboming .center_zhengboming .item_zhengboming {line-height: 70px;font-size: 18px;
}
/* 搜索部分樣式 */
.two_white-bar_zhengboming .search_zhengboming {width: 172px;height: 70px;display: flex;align-items: center;position: relative;
}
.two_white-bar_zhengboming .search_zhengboming .icon_zhengboming {background-image: url('/images/search.png');width: 30px;height: 30px;position: absolute;
}
.two_white-bar_zhengboming .search_zhengboming input {padding-left: 30px;width: 80%;height: 31px;border: none;outline: none;border-bottom: 3px solid #eee;
}
.two_white-bar_zhengboming .card_zhengboming {background-image: url('/images/car.png');width: 23px;height: 23px;position: relative;
}
/* 購物車樣式 */
.two_white-bar_zhengboming .card_zhengboming .tip_zhengboming {width: 15px;height: 12px;background-color: #e2643a;font-size: 10px;color: white;border-radius: 3px;text-align: center;line-height: 10px;position: absolute;right: -8px;
}
/* banner布局 */
.three_banner_zhengboming {width: 1240px;height: 500px;margin: 5px auto;background-image: url('/images/banner_1.png');background-size: 100% 100%;display: flex;justify-content: space-around;
}
/* banner左側樣式 */
.three_banner_zhengboming .left_zhengboming {width: 252px;height: 500px;background-color: rgba(0, 0, 0, 0.5);color: white;
}
/* banner左側每一項 */
.three_banner_zhengboming .left_zhengboming .item_zhengboming {height: 50px;position: relative;padding-left: 25px;cursor: pointer;line-height: 50px;
}
.three_banner_zhengboming .left_zhengboming .item_zhengboming .category_zhengboming {font-size: 15px;margin-right: 10px;
}
.three_banner_zhengboming .left_zhengboming .item_zhengboming .description_zhengboming {font-size: 13px;
}
.three_banner_zhengboming .left_zhengboming .item_zhengboming .arrow_zhengboming {width: 50px;height: 50px;position: absolute;top: 0;right: 0;text-align: center;
}
/* banner左側每項鼠標移入樣式 */
.three_banner_zhengboming .left_zhengboming .item_zhengboming:hover {background-color: #27ba9b;
}
/* banner右側樣式 */
.three_banner_zhengboming .right_zhengboming {display: flex;width: 988px;justify-content: space-between;align-items: center;padding: 0 10px;
}
/* banner右側箭頭按鈕樣式 */
.three_banner_zhengboming .right_zhengboming .prev_btn_zhengboming,.next_btn_zhengboming {width: 45px;height: 45px;border-radius: 50%;background-color: rgba(0, 0, 0, 0.3);text-align: center;line-height: 45px;color: white;
}
/* 新鮮好物布局 */
.four_xinxianhaowu_zhengboming {width: 1240px;height: 520px;margin: 5px auto;
}
/* 新鮮好物上方布局 */
.four_xinxianhaowu_zhengboming .top_zhengboming {height: 114px;display: flex;justify-content: space-between;padding: 0 50px;align-items: center;
}
.four_xinxianhaowu_zhengboming .top_zhengboming .left_zhengboming {display: flex;align-items: center;
}
.four_xinxianhaowu_zhengboming .top_zhengboming .left_zhengboming .title_zhengboming {font-size: 30px;margin-right: 30px;
}
.four_xinxianhaowu_zhengboming .top_zhengboming .left_zhengboming .tip_zhengboming {color: darkgray;
}
/* 新鮮好物內容樣式 */
.four_xinxianhaowu_zhengboming .content_zhengboming {display: flex;
}
.four_xinxianhaowu_zhengboming .content_zhengboming .item_zhengboming {height: 405px;text-align: center;margin-right: 10px;
}
.four_xinxianhaowu_zhengboming .content_zhengboming .item_zhengboming img {width: 304px;height: 304px;
}
.four_xinxianhaowu_zhengboming .content_zhengboming .item_zhengboming .price {color: red;
}
.four_xinxianhaowu_zhengboming .content_zhengboming .item_zhengboming .price .num {font-size: 20px;
}
/* 生鮮布局 */
.five_shengxian_zhengboming {width: 1240px;height: 706px;margin: 5px auto 40px;
}
/* 生鮮頂部樣式 */
.five_shengxian_zhengboming .top_zhengboming {height: 96px;display: flex;justify-content: space-between;padding: 0 50px;align-items: center;
}
.five_shengxian_zhengboming .top_zhengboming .title_zhengboming {font-size: 25px;
}
.five_shengxian_zhengboming .top_zhengboming .right_zhengboming {display: flex;
}
.five_shengxian_zhengboming .top_zhengboming .right_zhengboming .left_zhengboming {display: flex;margin-right: 40px;
}
.five_shengxian_zhengboming .top_zhengboming .right_zhengboming .left_zhengboming .item_zhengboming {margin: 0 10px;padding: 0 8px;height: 30px;
}
/* 生鮮頂部選中樣式 */
.five_shengxian_zhengboming .top_zhengboming .right_zhengboming .left_zhengboming .active_zhengboming {background-color: #27ba9b;color: white;border-radius: 5px;
}
.five_shengxian_zhengboming .top_zhengboming .right_zhengboming .right_zhengboming {color: darkgray;
}
/* 生鮮內容樣式 */
.five_shengxian_zhengboming .content_zhengboming {display: flex;
}
.five_shengxian_zhengboming .content_zhengboming .left_zhengboming {width: 240px;height: 610px;background-image: url('/images/fresh_goods_cover.png');background-size: 100% 100%;
}
.five_shengxian_zhengboming .content_zhengboming .right_zhengboming {width: 1000px;display: flex;flex-wrap: wrap;
}
/* 生鮮內容中每一項樣式 */
.five_shengxian_zhengboming .content_zhengboming .right_zhengboming .item_zhengboming {width: 225px;height: 304px;margin: 10px;cursor: pointer;position: relative;overflow: hidden;
}
/* 生鮮內容中每一項鼠標移入樣式 */
.five_shengxian_zhengboming .content_zhengboming .right_zhengboming .item_zhengboming:hover {border: 1px solid #27ba9b;
}
.five_shengxian_zhengboming .content_zhengboming .right_zhengboming .item_zhengboming:hover .hidden_zhengboming {bottom: 0;
}
.five_shengxian_zhengboming .content_zhengboming .right_zhengboming .item_zhengboming img {width: 184px;height: 184px;
}
.five_shengxian_zhengboming .content_zhengboming .right_zhengboming .item_zhengboming p:nth-child(3) {color: red;
}
/* 生鮮內容中隱藏部分 */
.five_shengxian_zhengboming .content_zhengboming .right_zhengboming .item_zhengboming .hidden_zhengboming {position: absolute;bottom: -80px;width: 225px;height: 80px;background-color: #27ba9b;color: white;text-align: center;
}
.five_shengxian_zhengboming .content_zhengboming .right_zhengboming .item_zhengboming .hidden_zhengboming p {margin: 0;
}
/* 專題部分樣式 */
.fix_zhuanti_zhengboming {width: 1240px;height: 512px;margin: 20px auto;background-color: #f5f5f5;
}
/* 專題頂部樣式 */
.fix_zhuanti_zhengboming .top_zhengboming {height: 115px;display: flex;justify-content: space-between;align-items: center;padding: 0 50px;
}
.fix_zhuanti_zhengboming .top_zhengboming .left_zhengboming {font-size: 30px;
}
.fix_zhuanti_zhengboming .top_zhengboming .right_zhengboming {color: darkgray;
}
/* 專題內容樣式 */
.fix_zhuanti_zhengboming .content_zhengboming {display: flex;justify-content: center;
}
/* 專題內容每項樣式 */
.fix_zhuanti_zhengboming .content_zhengboming .item_zhengboming {width: 350px;height: 356px;margin-right: 10px;
}
.fix_zhuanti_zhengboming .content_zhengboming .item_zhengboming .img_zhengboming {height: 288px;background-size: 100% 100%;background-image: url('/images/topic_goods_1.jpg');display: flex;align-items: flex-end;
}
.fix_zhuanti_zhengboming .content_zhengboming .item_zhengboming .img_zhengboming .info_zhengboming {width: 404px;height: 67px;display: flex;justify-content: space-around;
}
.fix_zhuanti_zhengboming .content_zhengboming .item_zhengboming .img_zhengboming .info_zhengboming .left_zhengboming p {margin: 0;
}
.fix_zhuanti_zhengboming .content_zhengboming .item_zhengboming .img_zhengboming .info_zhengboming .left_zhengboming p:nth-child(1) {color: white;margin-bottom: 10px;
}
.fix_zhuanti_zhengboming .content_zhengboming .item_zhengboming .img_zhengboming .info_zhengboming .left_zhengboming p:nth-child(2) {color: darkgray;
}
.fix_zhuanti_zhengboming .content_zhengboming .item_zhengboming .img_zhengboming .info_zhengboming .right_zhengboming {background-color: white;color: red;width: 80px;height: 30px;line-height: 30px;text-align: center;border-radius: 5px;
}
/* 專題內容底部樣式 */
.fix_zhuanti_zhengboming .content_zhengboming .item_zhengboming .bottom_zhengboming {height: 67px;background-color: white;display: flex;justify-content: space-between;padding: 0 15px;align-items: center;
}
.fix_zhuanti_zhengboming .content_zhengboming .item_zhengboming .bottom_zhengboming .left_zhengboming {display: flex;
}
.fix_zhuanti_zhengboming .content_zhengboming .item_zhengboming .bottom_zhengboming .left_zhengboming div {margin-right: 20px;
}
.fix_zhuanti_zhengboming .content_zhengboming .item_zhengboming .bottom_zhengboming .right_zhengboming {display: flex;
}
/* 底部樣式 */
.seven_bottom_zhengboming {height: 643px;
}
/* 底部上方布局 */
.seven_bottom_zhengboming .top_zhengboming {height: 302px;display: flex;justify-content: center;
}
.seven_bottom_zhengboming .top_zhengboming .item_zhengboming {text-align: center;margin: 0 10px;
}
.seven_bottom_zhengboming .top_zhengboming .item_zhengboming p {color: darkgray;
}
.seven_bottom_zhengboming .top_zhengboming .item_zhengboming .icon_zhengboming {display: flex;justify-content: center;align-items: center;margin-top: 50px;
}
/* 左右兩側樣式 */
.seven_bottom_zhengboming .top_zhengboming .item_zhengboming .icon_zhengboming .left_zhengboming,
.seven_bottom_zhengboming .top_zhengboming .item_zhengboming .icon_zhengboming .right_zhengboming {width: 70px;height: 70px;box-shadow: 0 0 5px 0 rgba(0, 0, 0, 0.1);display: flex;flex-direction: column;justify-content: center;align-items: center;padding: 10px;margin-right: 10px;
}
.seven_bottom_zhengboming .top_zhengboming .item_zhengboming .icon_zhengboming .tip_zhengboming {font-size: 15px;
}
.seven_bottom_zhengboming .top_zhengboming .item_zhengboming .icon_zhengboming .tip_zhengboming p {margin: 0;
}
.seven_bottom_zhengboming .top_zhengboming .item_zhengboming .icon_zhengboming .tip_zhengboming .btn_zhengboming {margin-top: 10px;border-radius: 5px;padding: 5px 10px;color: white;background-color: #26b99a;
}
.seven_bottom_zhengboming .top_zhengboming .item_zhengboming .info_zhengboming {margin-top: 30px;height: 100px;display: flex;flex-direction: column;justify-content: center;
}
.seven_bottom_zhengboming .top_zhengboming .item_zhengboming .info_zhengboming p {margin: 0;
}
.seven_bottom_zhengboming .top_zhengboming .item_zhengboming .info_zhengboming p:nth-child(1) {font-size: 20px;color: #8d8c86;
}
.seven_bottom_zhengboming .top_zhengboming .item_zhengboming .info_zhengboming p:nth-child(2) {font-size: 13px;
}
/* 底部中間部分樣式 */
.seven_bottom_zhengboming .center_zhengboming {height: 172px;background-color: #333333;display: flex;justify-content: center;align-items: center;border-bottom: 1px solid white;
}
.seven_bottom_zhengboming .center_zhengboming .item_zhengboming {display: flex;align-items: center;margin: 0 10px;
}
.seven_bottom_zhengboming .center_zhengboming .item_zhengboming span {color: white;font-size: 20px;
}
/* 底部下方樣式 */
.seven_bottom_zhengboming .footer_zhengboming {color: white;height: 169px;background-color: #333333;display: flex;flex-direction: column;justify-content: center;align-items: center;
}
效果圖
?
?
--邊緣提取和相機模型)
