H5C3第二个完整大项目————天猫国际首页跳转登录页
2024-04-01 10:21:25
本项目较第一个项目来说完善了很多，基本没有什么明显的问题，也适当加入了动画，过度，锚点等功能，对H5C3的项目书写也更加熟练。
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"><title>天猫国际</title><link rel="stylesheet" href="./img/font-awesome-4.7.0/font-awesome-4.7.0/css/font-awesome.min.css"><link rel="stylesheet" href="./首页.css"><link rel="stylesheet" href="./img/swiper/swiper-bundle.min.css"></head><body><div><aside><ul><li><a href="#a"><img src="./img/1.png" alt=""><span class="ce-2">美容护肤</span></a></li><li><a href="#b"><img src="./img/2.png" alt=""><span class="ce-2">个人护理</span></a></li><li><a href="#c"><img src="./img/3.png" alt=""><span class="ce-2">母婴用品</span></a></li><li><a href="#d"><img src="./img/4.png" alt=""><span class="ce-2">食品饮料</span></a></li><li><a href="#e"><img src="./img/5.png" alt=""><span class="ce-2">营养保健</span></a></li><li><a href="#f"><img src="./img/7.png" alt=""><span class="ce-2">服饰箱包</span></a></li><li><a href=""><img src="./img/8.png" alt=""></a></li></ul></aside><nav><div id="a" class="nav-center"><ul class="nav-left"><li class="nl-home"><a href=""><img src="./img/home.png" alt=""><div>天猫首页</div></a></li><li><a href="">喵，欢迎来到天猫国际</a></li><li><a href="../登录页/登录.html">请登录</a></li></ul><ul class="nav-right"><li><a href="">商家中心</a></li><li class="my-tb"><a href=""> 商家支持<span class="nav-sanjiao xuan"></span></a><ul class="my-tb1"><li><a href="">已买到的宝贝</a></li><li><a href="">已卖出的宝贝</a></li></ul></li></li><li><a href="">网页无障碍</a></li><li><a href="">淘宝网</a></li><li class="nav-tu1"><a href=""><i class="fa fa-mobile" aria-hidden="true"></i>手机版</a><ul class="nav-tu"><div class="nav-sanjiao tu-sj"></div><li><img src="./img/0.01.jpg" alt="" width="145px"></li></ul></li><li><div class="nav-long"></div></li><li class="my-tb l-1"><a href="">收藏夹<span class="nav-sanjiao xuan"></span></a><ul class="my-tb1"><li><a href="">已买到的宝贝</a></li><li><a href="">已卖出的宝贝</a></li></ul></li><li><a href=""><i class="fa fa-shopping-cart" aria-hidden="true"></i>购物车</a></li><li class="my-tb"><a href="">我的淘宝<span class="nav-sanjiao xuan"></span></a><ul class="my-tb1"><li><a href="">已买到的宝贝</a></li><li><a href="">已卖出的宝贝</a></li></ul></li></ul></div></nav><header><div class="h-all"><div class="header-left"><img class="h-img1" src="./img/天猫国际.png" alt=""><img class="h-img2"src="./img/我的.png" alt=""></div><div class="header-right"><div class="hr-1"></div><div class="hr-2"> <span>搜 索</span></div></div></div></header><main><div id="b" class="main-head"><ul class="main-center"><li class="mh-one"><a href="">全部商品分类</a></li><li class="mh-two"><a href="">首页</a></li><li class="mh-three"><a href="">全球精选</a></li><li class="mh-three"><a href="">进口超市</a></li><li class="mh-three"><a href="">海外直购</a></li></ul></div><div class="main-main"><ul class="mm"><li class="mm-1"><a href=""><div class="mm-tu"><img src="./img/下载.png" alt=""><div class="tu-font">美妆个护</div></div><div class="font">面膜/防晒/面部护理套装</div></a><ul><div><a href=""><div class="item i0"><div class="item-1"><div class="item-11">美妆护肤</div><div class="item12"><a class="i-red" href="">保湿补水</a><div class="nav-long nl1"></div><a href="">乳液/面霜</a><div class="nav-long nl1"></div><a href="">化妆水/爽肤水</a><a class="i-red" href="">面部护理套装</a><div class="nav-long nl1"></div><a href="">眼部护理</a><div class="nav-long nl1"></div><a href="">男士护理</a><a href="">精油芳疗</a><div class="nav-long nl1"></div><a href="">身体护理</a><div class="nav-long nl1"></div><a href="">手法护理</a><div class="nav-long nl1"></div><a class="i-red" href="">胸部护理</a><a href="">润唇膏</a><div class="nav-long nl1"></div><a href="">防晒</a><div class="nav-long nl1"></div><a href="">面膜</a><div class="nav-long nl1"></div><a href="">磨砂/去角质/按摩</a></div></div><div class="item-1 it-1"><div class="item-11">彩妆香水</div><div class="item12"><a class="i-red" href="">保湿补水</a><div class="nav-long nl1"></div><a href="">乳液/面霜</a><div class="nav-long nl1"></div><a href="">化妆水/爽肤水</a><a class="i-red" href="">面部护理套装</a><div class="nav-long nl1"></div><a href="">眼部护理</a><div class="nav-long nl1"></div><a href="">男士护理</a><a href="">精油芳疗</a><div class="nav-long nl1"></div><a href="">身体护理</a><div class="nav-long nl1"></div><a href="">手法护理</a><div class="nav-long nl1"></div><a class="i-red" href="">胸部护理</a><a href="">润唇膏</a><div class="nav-long nl1"></div><a href="">防晒</a><div class="nav-long nl1"></div><a href="">面膜</a><div class="nav-long nl1"></div><a href="">磨砂/去角质/按摩</a></div></div><div class="item-1 it-2"><div class="item-11">化妆水/爽肤水</div><div class="item12"><a class="i-red" href="">保湿补水</a><div class="nav-long nl1"></div><a href="">乳液/面霜</a><div class="nav-long nl1"></div><a href="">化妆水/爽肤水</a><a class="i-red" href="">面部护理套装</a><div class="nav-long nl1"></div><a href="">眼部护理</a><div class="nav-long nl1"></div><a href="">男士护理</a><a href="">精油芳疗</a><div class="nav-long nl1"></div><a href="">身体护理</a><div class="nav-long nl1"></div><a href="">手法护理</a><div class="nav-long nl1"></div><a class="i-red" href="">胸部护理</a><a href="">润唇膏</a><div class="nav-long nl1"></div><a href="">防晒</a><div class="nav-long nl1"></div><a href="">面膜</a><div class="nav-long nl1"></div><a href="">磨砂/去角质/按摩</a></div></div><div class="item-1 it-3"><div class="item-11">磨砂/去角质/按摩</div><div class="item12"><a class="i-red" href="">保湿补水</a><div class="nav-long nl1"></div><a href="">乳液/面霜</a><div class="nav-long nl1"></div><a href="">化妆水/爽肤水</a><a class="i-red" href="">面部护理套装</a><div class="nav-long nl1"></div><a href="">眼部护理</a><div class="nav-long nl1"></div><a href="">男士护理</a><a href="">精油芳疗</a><div class="nav-long nl1"></div><a href="">身体护理</a><div class="nav-long nl1"></div><a href="">手法护理</a><div class="nav-long nl1"></div><a class="i-red" href="">胸部护理</a><a href="">润唇膏</a><div class="nav-long nl1"></div><a href="">防晒</a><div class="nav-long nl1"></div><a href="">面膜</a><div class="nav-long nl1"></div><a href="">磨砂/去角质/按摩</a></div></div><div class="item-1 it-4"><div class="item-11">面部护理套装</div><div class="item12"><a class="i-red" href="">保湿补水</a><div class="nav-long nl1"></div><a href="">乳液/面霜</a><div class="nav-long nl1"></div><a href="">化妆水/爽肤水</a><a class="i-red" href="">面部护理套装</a><div class="nav-long nl1"></div><a href="">眼部护理</a><div class="nav-long nl1"></div><a href="">男士护理</a><a href="">精油芳疗</a><div class="nav-long nl1"></div><a href="">身体护理</a><div class="nav-long nl1"></div><a href="">手法护理</a><div class="nav-long nl1"></div><a class="i-red" href="">胸部护理</a><a href="">润唇膏</a><div class="nav-long nl1"></div><a href="">防晒</a><div class="nav-long nl1"></div><a href="">面膜</a><div class="nav-long nl1"></div><a href="">磨砂/去角质/按摩</a></div></div><div class="item-1 it-5"><div class="item-11">眼部护理</div><div class="item12"><a class="i-red" href="">保湿补水</a><div class="nav-long nl1"></div><a href="">乳液/面霜</a><div class="nav-long nl1"></div><a href="">化妆水/爽肤水</a><a class="i-red" href="">面部护理套装</a><div class="nav-long nl1"></div><a href="">眼部护理</a><div class="nav-long nl1"></div><a href="">男士护理</a><a href="">精油芳疗</a><div class="nav-long nl1"></div><a href="">身体护理</a><div class="nav-long nl1"></div><a href="">手法护理</a><div class="nav-long nl1"></div><a class="i-red" href="">胸部护理</a><a href="">润唇膏</a><div class="nav-long nl1"></div><a href="">防晒</a><div class="nav-long nl1"></div><a href="">面膜</a><div class="nav-long nl1"></div><a href="">磨砂/去角质/按摩</a></div></div></a></div></li></ul></li><li class="mm-22"><a href=""><div class="mm-tu"><img src="./img/下载 (1).png" alt=""><div class="tu-font">食品保健</div></div><div class="font">代餐奶昔/酵素/葡萄酒</div></a><ul><li><a href=""><div class="item i1"><div class="item-1"><div class="item-11">酵素/葡萄酒</div><div class="item12"><a class="i-red" href="">保湿补水</a><div class="nav-long nl1"></div><a href="">乳液/面霜</a><div class="nav-long nl1"></div><a href="">化妆水/爽肤水</a><a class="i-red" href="">面部护理套装</a><div class="nav-long nl1"></div><a href="">眼部护理</a><div class="nav-long nl1"></div><a href="">男士护理</a><a href="">精油芳疗</a><div class="nav-long nl1"></div><a href="">身体护理</a><div class="nav-long nl1"></div><a href="">手法护理</a><div class="nav-long nl1"></div><a class="i-red" href="">胸部护理</a><a href="">润唇膏</a><div class="nav-long nl1"></div><a href="">防晒</a><div class="nav-long nl1"></div><a href="">面膜</a><div class="nav-long nl1"></div><a href="">磨砂/去角质/按摩</a></div></div><div class="item-1 it-1"><div class="item-11">精油芳疗</div><div class="item12"><a class="i-red" href="">保湿补水</a><div class="nav-long nl1"></div><a href="">乳液/面霜</a><div class="nav-long nl1"></div><a href="">化妆水/爽肤水</a><a class="i-red" href="">面部护理套装</a><div class="nav-long nl1"></div><a href="">眼部护理</a><div class="nav-long nl1"></div><a href="">男士护理</a><a href="">精油芳疗</a><div class="nav-long nl1"></div><a href="">身体护理</a><div class="nav-long nl1"></div><a href="">手法护理</a><div class="nav-long nl1"></div><a class="i-red" href="">胸部护理</a><a href="">润唇膏</a><div class="nav-long nl1"></div><a href="">防晒</a><div class="nav-long nl1"></div><a href="">面膜</a><div class="nav-long nl1"></div><a href="">磨砂/去角质/按摩</a></div></div><div class="item-1 it-2"><div class="item-11">润唇膏</div><div class="item12"><a class="i-red" href="">保湿补水</a><div class="nav-long nl1"></div><a href="">乳液/面霜</a><div class="nav-long nl1"></div><a href="">化妆水/爽肤水</a><a class="i-red" href="">面部护理套装</a><div class="nav-long nl1"></div><a href="">眼部护理</a><div class="nav-long nl1"></div><a href="">男士护理</a><a href="">精油芳疗</a><div class="nav-long nl1"></div><a href="">身体护理</a><div class="nav-long nl1"></div><a href="">手法护理</a><div class="nav-long nl1"></div><a class="i-red" href="">胸部护理</a><a href="">润唇膏</a><div class="nav-long nl1"></div><a href="">防晒</a><div class="nav-long nl1"></div><a href="">面膜</a><div class="nav-long nl1"></div><a href="">磨砂/去角质/按摩</a></div></div><div class="item-1 it-3"><div class="item-11">面膜</div><div class="item12"><a class="i-red" href="">保湿补水</a><div class="nav-long nl1"></div><a href="">乳液/面霜</a><div class="nav-long nl1"></div><a href="">化妆水/爽肤水</a><a class="i-red" href="">面部护理套装</a><div class="nav-long nl1"></div><a href="">眼部护理</a><div class="nav-long nl1"></div><a href="">男士护理</a><a href="">精油芳疗</a><div class="nav-long nl1"></div><a href="">身体护理</a><div class="nav-long nl1"></div><a href="">手法护理</a><div class="nav-long nl1"></div><a class="i-red" href="">胸部护理</a><a href="">润唇膏</a><div class="nav-long nl1"></div><a href="">防晒</a><div class="nav-long nl1"></div><a href="">面膜</a><div class="nav-long nl1"></div><a href="">磨砂/去角质/按摩</a></div></div><div class="item-1 it-4"><div class="item-11">乳液/面霜</div><div class="item12"><a class="i-red" href="">保湿补水</a><div class="nav-long nl1"></div><a href="">乳液/面霜</a><div class="nav-long nl1"></div><a href="">化妆水/爽肤水</a><a class="i-red" href="">面部护理套装</a><div class="nav-long nl1"></div><a href="">眼部护理</a><div class="nav-long nl1"></div><a href="">男士护理</a><a href="">精油芳疗</a><div class="nav-long nl1"></div><a href="">身体护理</a><div class="nav-long nl1"></div><a href="">手法护理</a><div class="nav-long nl1"></div><a class="i-red" href="">胸部护理</a><a href="">润唇膏</a><div class="nav-long nl1"></div><a href="">防晒</a><div class="nav-long nl1"></div><a href="">面膜</a><div class="nav-long nl1"></div><a href="">磨砂/去角质/按摩</a></div></div><div class="item-1 it-5"><div class="item-11">男士护理</div><div class="item12"><a class="i-red" href="">保湿补水</a><div class="nav-long nl1"></div><a href="">乳液/面霜</a><div class="nav-long nl1"></div><a href="">化妆水/爽肤水</a><a class="i-red" href="">面部护理套装</a><div class="nav-long nl1"></div><a href="">眼部护理</a><div class="nav-long nl1"></div><a href="">男士护理</a><a href="">精油芳疗</a><div class="nav-long nl1"></div><a href="">身体护理</a><div class="nav-long nl1"></div><a href="">手法护理</a><div class="nav-long nl1"></div><a class="i-red" href="">胸部护理</a><a href="">润唇膏</a><div class="nav-long nl1"></div><a href="">防晒</a><div class="nav-long nl1"></div><a href="">面膜</a><div class="nav-long nl1"></div><a href="">磨砂/去角质/按摩</a></div></div></div></a></li></ul></li><li class="mm-3"><a href=""><div class="mm-tu"><img src="./img/下载 (2).png" alt=""><div class="tu-font">母婴用品</div></div><div class="font">奶粉/纸尿裤/钙铁锌</div></a><ul><li><a href=""><div class="item i2"><div class="item-1"><div class="item-11">保湿补水</div><div class="item12"><a class="i-red" href="">保湿补水</a><div class="nav-long nl1"></div><a href="">乳液/面霜</a><div class="nav-long nl1"></div><a href="">化妆水/爽肤水</a><a class="i-red" href="">面部护理套装</a><div class="nav-long nl1"></div><a href="">眼部护理</a><div class="nav-long nl1"></div><a href="">男士护理</a><a href="">精油芳疗</a><div class="nav-long nl1"></div><a href="">身体护理</a><div class="nav-long nl1"></div><a href="">手法护理</a><div class="nav-long nl1"></div><a class="i-red" href="">胸部护理</a><a href="">润唇膏</a><div class="nav-long nl1"></div><a href="">防晒</a><div class="nav-long nl1"></div><a href="">面膜</a><div class="nav-long nl1"></div><a href="">磨砂/去角质/按摩</a></div></div><div class="item-1 it-1"><div class="item-11">手法护理</div><div class="item12"><a class="i-red" href="">保湿补水</a><div class="nav-long nl1"></div><a href="">乳液/面霜</a><div class="nav-long nl1"></div><a href="">化妆水/爽肤水</a><a class="i-red" href="">面部护理套装</a><div class="nav-long nl1"></div><a href="">眼部护理</a><div class="nav-long nl1"></div><a href="">男士护理</a><a href="">精油芳疗</a><div class="nav-long nl1"></div><a href="">身体护理</a><div class="nav-long nl1"></div><a href="">手法护理</a><div class="nav-long nl1"></div><a class="i-red" href="">胸部护理</a><a href="">润唇膏</a><div class="nav-long nl1"></div><a href="">防晒</a><div class="nav-long nl1"></div><a href="">面膜</a><div class="nav-long nl1"></div><a href="">磨砂/去角质/按摩</a></div></div><div class="item-1 it-2"><div class="item-11">胸部护理</div><div class="item12"><a class="i-red" href="">保湿补水</a><div class="nav-long nl1"></div><a href="">乳液/面霜</a><div class="nav-long nl1"></div><a href="">化妆水/爽肤水</a><a class="i-red" href="">面部护理套装</a><div class="nav-long nl1"></div><a href="">眼部护理</a><div class="nav-long nl1"></div><a href="">男士护理</a><a href="">精油芳疗</a><div class="nav-long nl1"></div><a href="">身体护理</a><div class="nav-long nl1"></div><a href="">手法护理</a><div class="nav-long nl1"></div><a class="i-red" href="">胸部护理</a><a href="">润唇膏</a><div class="nav-long nl1"></div><a href="">防晒</a><div class="nav-long nl1"></div><a href="">面膜</a><div class="nav-long nl1"></div><a href="">磨砂/去角质/按摩</a></div></div><div class="item-1 it-3"><div class="item-11">乳液/面霜</div><div class="item12"><a class="i-red" href="">保湿补水</a><div class="nav-long nl1"></div><a href="">乳液/面霜</a><div class="nav-long nl1"></div><a href="">化妆水/爽肤水</a><a class="i-red" href="">面部护理套装</a><div class="nav-long nl1"></div><a href="">眼部护理</a><div class="nav-long nl1"></div><a href="">男士护理</a><a href="">精油芳疗</a><div class="nav-long nl1"></div><a href="">身体护理</a><div class="nav-long nl1"></div><a href="">手法护理</a><div class="nav-long nl1"></div><a class="i-red" href="">胸部护理</a><a href="">润唇膏</a><div class="nav-long nl1"></div><a href="">防晒</a><div class="nav-long nl1"></div><a href="">面膜</a><div class="nav-long nl1"></div><a href="">磨砂/去角质/按摩</a></div></div><div class="item-1 it-4"><div class="item-11">美妆护肤</div><div class="item12"><a class="i-red" href="">保湿补水</a><div class="nav-long nl1"></div><a href="">乳液/面霜</a><div class="nav-long nl1"></div><a href="">化妆水/爽肤水</a><a class="i-red" href="">面部护理套装</a><div class="nav-long nl1"></div><a href="">眼部护理</a><div class="nav-long nl1"></div><a href="">男士护理</a><a href="">精油芳疗</a><div class="nav-long nl1"></div><a href="">身体护理</a><div class="nav-long nl1"></div><a href="">手法护理</a><div class="nav-long nl1"></div><a class="i-red" href="">胸部护理</a><a href="">润唇膏</a><div class="nav-long nl1"></div><a href="">防晒</a><div class="nav-long nl1"></div><a href="">面膜</a><div class="nav-long nl1"></div><a href="">磨砂/去角质/按摩</a></div></div><div class="item-1 it-5"><div class="item-11">美妆护肤</div><div class="item12"><a class="i-red" href="">保湿补水</a><div class="nav-long nl1"></div><a href="">乳液/面霜</a><div class="nav-long nl1"></div><a href="">化妆水/爽肤水</a><a class="i-red" href="">面部护理套装</a><div class="nav-long nl1"></div><a href="">眼部护理</a><div class="nav-long nl1"></div><a href="">男士护理</a><a href="">精油芳疗</a><div class="nav-long nl1"></div><a href="">身体护理</a><div class="nav-long nl1"></div><a href="">手法护理</a><div class="nav-long nl1"></div><a class="i-red" href="">胸部护理</a><a href="">润唇膏</a><div class="nav-long nl1"></div><a href="">防晒</a><div class="nav-long nl1"></div><a href="">面膜</a><div class="nav-long nl1"></div><a href="">磨砂/去角质/按摩</a></div></div></div></a></li></ul></li><li class="mm-4"><a href=""><div class="mm-tu"><img src="./img/下载 (3).png" alt=""><div class="tu-font">服饰鞋包</div></div><div class="font">腕表/箱包/潮流穿搭</div></a><ul><li><a href=""><div class="item i3"><div class="item-1"><div class="item-11">爽肤水</div><div class="item12"><a class="i-red" href="">保湿补水</a><div class="nav-long nl1"></div><a href="">乳液/面霜</a><div class="nav-long nl1"></div><a href="">化妆水/爽肤水</a><a class="i-red" href="">面部护理套装</a><div class="nav-long nl1"></div><a href="">眼部护理</a><div class="nav-long nl1"></div><a href="">男士护理</a><a href="">精油芳疗</a><div class="nav-long nl1"></div><a href="">身体护理</a><div class="nav-long nl1"></div><a href="">手法护理</a><div class="nav-long nl1"></div><a class="i-red" href="">胸部护理</a><a href="">润唇膏</a><div class="nav-long nl1"></div><a href="">防晒</a><div class="nav-long nl1"></div><a href="">面膜</a><div class="nav-long nl1"></div><a href="">磨砂/去角质/按摩</a></div></div><div class="item-1 it-1"><div class="item-11">美妆护肤</div><div class="item12"><a class="i-red" href="">保湿补水</a><div class="nav-long nl1"></div><a href="">乳液/面霜</a><div class="nav-long nl1"></div><a href="">化妆水/爽肤水</a><a class="i-red" href="">面部护理套装</a><div class="nav-long nl1"></div><a href="">眼部护理</a><div class="nav-long nl1"></div><a href="">男士护理</a><a href="">精油芳疗</a><div class="nav-long nl1"></div><a href="">身体护理</a><div class="nav-long nl1"></div><a href="">手法护理</a><div class="nav-long nl1"></div><a class="i-red" href="">胸部护理</a><a href="">润唇膏</a><div class="nav-long nl1"></div><a href="">防晒</a><div class="nav-long nl1"></div><a href="">面膜</a><div class="nav-long nl1"></div><a href="">磨砂/去角质/按摩</a></div></div><div class="item-1 it-2"><div class="item-11">美妆护肤</div><div class="item12"><a class="i-red" href="">保湿补水</a><div class="nav-long nl1"></div><a href="">乳液/面霜</a><div class="nav-long nl1"></div><a href="">化妆水/爽肤水</a><a class="i-red" href="">面部护理套装</a><div class="nav-long nl1"></div><a href="">眼部护理</a><div class="nav-long nl1"></div><a href="">男士护理</a><a href="">精油芳疗</a><div class="nav-long nl1"></div><a href="">身体护理</a><div class="nav-long nl1"></div><a href="">手法护理</a><div class="nav-long nl1"></div><a class="i-red" href="">胸部护理</a><a href="">润唇膏</a><div class="nav-long nl1"></div><a href="">防晒</a><div class="nav-long nl1"></div><a href="">面膜</a><div class="nav-long nl1"></div><a href="">磨砂/去角质/按摩</a></div></div><div class="item-1 it-3"><div class="item-11">美妆护肤</div><div class="item12"><a class="i-red" href="">保湿补水</a><div class="nav-long nl1"></div><a href="">乳液/面霜</a><div class="nav-long nl1"></div><a href="">化妆水/爽肤水</a><a class="i-red" href="">面部护理套装</a><div class="nav-long nl1"></div><a href="">眼部护理</a><div class="nav-long nl1"></div><a href="">男士护理</a><a href="">精油芳疗</a><div class="nav-long nl1"></div><a href="">身体护理</a><div class="nav-long nl1"></div><a href="">手法护理</a><div class="nav-long nl1"></div><a class="i-red" href="">胸部护理</a><a href="">润唇膏</a><div class="nav-long nl1"></div><a href="">防晒</a><div class="nav-long nl1"></div><a href="">面膜</a><div class="nav-long nl1"></div><a href="">磨砂/去角质/按摩</a></div></div><div class="item-1 it-4"><div class="item-11">美妆护肤</div><div class="item12"><a class="i-red" href="">保湿补水</a><div class="nav-long nl1"></div><a href="">乳液/面霜</a><div class="nav-long nl1"></div><a href="">化妆水/爽肤水</a><a class="i-red" href="">面部护理套装</a><div class="nav-long nl1"></div><a href="">眼部护理</a><div class="nav-long nl1"></div><a href="">男士护理</a><a href="">精油芳疗</a><div class="nav-long nl1"></div><a href="">身体护理</a><div class="nav-long nl1"></div><a href="">手法护理</a><div class="nav-long nl1"></div><a class="i-red" href="">胸部护理</a><a href="">润唇膏</a><div class="nav-long nl1"></div><a href="">防晒</a><div class="nav-long nl1"></div><a href="">面膜</a><div class="nav-long nl1"></div><a href="">磨砂/去角质/按摩</a></div></div><div class="item-1 it-5"><div class="item-11">美妆护肤</div><div class="item12"><a class="i-red" href="">保湿补水</a><div class="nav-long nl1"></div><a href="">乳液/面霜</a><div class="nav-long nl1"></div><a href="">化妆水/爽肤水</a><a class="i-red" href="">面部护理套装</a><div class="nav-long nl1"></div><a href="">眼部护理</a><div class="nav-long nl1"></div><a href="">男士护理</a><a href="">精油芳疗</a><div class="nav-long nl1"></div><a href="">身体护理</a><div class="nav-long nl1"></div><a href="">手法护理</a><div class="nav-long nl1"></div><a class="i-red" href="">胸部护理</a><a href="">润唇膏</a><div class="nav-long nl1"></div><a href="">防晒</a><div class="nav-long nl1"></div><a href="">面膜</a><div class="nav-long nl1"></div><a href="">磨砂/去角质/按摩</a></div></div></div></a></li></ul></li><li class="mm-5"><a href=""><div class="mm-tu"><img src="./img/下载 (4).png" alt=""><div class="tu-font">生活/数码</div></div><div class="font">滤水壶/滤芯/扫地机器人</div></a><ul><li><a href=""><div class="item i4"><div class="item-1"><div class="item-11">美妆护肤</div><div class="item12"><a class="i-red" href="">保湿补水</a><div class="nav-long nl1"></div><a href="">乳液/面霜</a><div class="nav-long nl1"></div><a href="">化妆水/爽肤水</a><a class="i-red" href="">面部护理套装</a><div class="nav-long nl1"></div><a href="">眼部护理</a><div class="nav-long nl1"></div><a href="">男士护理</a><a href="">精油芳疗</a><div class="nav-long nl1"></div><a href="">身体护理</a><div class="nav-long nl1"></div><a href="">手法护理</a><div class="nav-long nl1"></div><a class="i-red" href="">胸部护理</a><a href="">润唇膏</a><div class="nav-long nl1"></div><a href="">防晒</a><div class="nav-long nl1"></div><a href="">面膜</a><div class="nav-long nl1"></div><a href="">磨砂/去角质/按摩</a></div></div><div class="item-1 it-1"><div class="item-11">美妆护肤</div><div class="item12"><a class="i-red" href="">保湿补水</a><div class="nav-long nl1"></div><a href="">乳液/面霜</a><div class="nav-long nl1"></div><a href="">化妆水/爽肤水</a><a class="i-red" href="">面部护理套装</a><div class="nav-long nl1"></div><a href="">眼部护理</a><div class="nav-long nl1"></div><a href="">男士护理</a><a href="">精油芳疗</a><div class="nav-long nl1"></div><a href="">身体护理</a><div class="nav-long nl1"></div><a href="">手法护理</a><div class="nav-long nl1"></div><a class="i-red" href="">胸部护理</a><a href="">润唇膏</a><div class="nav-long nl1"></div><a href="">防晒</a><div class="nav-long nl1"></div><a href="">面膜</a><div class="nav-long nl1"></div><a href="">磨砂/去角质/按摩</a></div></div><div class="item-1 it-2"><div class="item-11">美妆护肤</div><div class="item12"><a class="i-red" href="">保湿补水</a><div class="nav-long nl1"></div><a href="">乳液/面霜</a><div class="nav-long nl1"></div><a href="">化妆水/爽肤水</a><a class="i-red" href="">面部护理套装</a><div class="nav-long nl1"></div><a href="">眼部护理</a><div class="nav-long nl1"></div><a href="">男士护理</a><a href="">精油芳疗</a><div class="nav-long nl1"></div><a href="">身体护理</a><div class="nav-long nl1"></div><a href="">手法护理</a><div class="nav-long nl1"></div><a class="i-red" href="">胸部护理</a><a href="">润唇膏</a><div class="nav-long nl1"></div><a href="">防晒</a><div class="nav-long nl1"></div><a href="">面膜</a><div class="nav-long nl1"></div><a href="">磨砂/去角质/按摩</a></div></div><div class="item-1 it-3"><div class="item-11">美妆护肤</div><div class="item12"><a class="i-red" href="">保湿补水</a><div class="nav-long nl1"></div><a href="">乳液/面霜</a><div class="nav-long nl1"></div><a href="">化妆水/爽肤水</a><a class="i-red" href="">面部护理套装</a><div class="nav-long nl1"></div><a href="">眼部护理</a><div class="nav-long nl1"></div><a href="">男士护理</a><a href="">精油芳疗</a><div class="nav-long nl1"></div><a href="">身体护理</a><div class="nav-long nl1"></div><a href="">手法护理</a><div class="nav-long nl1"></div><a class="i-red" href="">胸部护理</a><a href="">润唇膏</a><div class="nav-long nl1"></div><a href="">防晒</a><div class="nav-long nl1"></div><a href="">面膜</a><div class="nav-long nl1"></div><a href="">磨砂/去角质/按摩</a></div></div><div class="item-1 it-4"><div class="item-11">美妆护肤</div><div class="item12"><a class="i-red" href="">保湿补水</a><div class="nav-long nl1"></div><a href="">乳液/面霜</a><div class="nav-long nl1"></div><a href="">化妆水/爽肤水</a><a class="i-red" href="">面部护理套装</a><div class="nav-long nl1"></div><a href="">眼部护理</a><div class="nav-long nl1"></div><a href="">男士护理</a><a href="">精油芳疗</a><div class="nav-long nl1"></div><a href="">身体护理</a><div class="nav-long nl1"></div><a href="">手法护理</a><div class="nav-long nl1"></div><a class="i-red" href="">胸部护理</a><a href="">润唇膏</a><div class="nav-long nl1"></div><a href="">防晒</a><div class="nav-long nl1"></div><a href="">面膜</a><div class="nav-long nl1"></div><a href="">磨砂/去角质/按摩</a></div></div><div class="item-1 it-5"><div class="item-11">美妆护肤</div><div class="item12"><a class="i-red" href="">保湿补水</a><div class="nav-long nl1"></div><a href="">乳液/面霜</a><div class="nav-long nl1"></div><a href="">化妆水/爽肤水</a><a class="i-red" href="">面部护理套装</a><div class="nav-long nl1"></div><a href="">眼部护理</a><div class="nav-long nl1"></div><a href="">男士护理</a><a href="">精油芳疗</a><div class="nav-long nl1"></div><a href="">身体护理</a><div class="nav-long nl1"></div><a href="">手法护理</a><div class="nav-long nl1"></div><a class="i-red" href="">胸部护理</a><a href="">润唇膏</a><div class="nav-long nl1"></div><a href="">防晒</a><div class="nav-long nl1"></div><a href="">面膜</a><div class="nav-long nl1"></div><a href="">磨砂/去角质/按摩</a></div></div></div></a></li></ul></li></ul><div class="lbt"><div class="swiper-pagination"></div><!-- Swiper --><div class="swiper mySwiper"><div class="swiper-wrapper"><div class="swiper-slide"><img src="./img/lbt1.png" alt=""></div><div class="swiper-slide"><img src="./img/lbt2.png" alt=""></div></div><div class="swiper-button-next"><a href=""></a></div><div class="swiper-button-prev"><a href=""></a></div></div><!-- Initialize Swiper --><script src="./img/swiper/swiper-bundle.min.js"></script><script>var swiper = new Swiper(".mySwiper", {spaceBetween: 30,centeredSlides: true,autoplay: {delay: 2500,disableOnInteraction: false,},pagination: {el: ".swiper-pagination",clickable: true,},navigation: {nextEl: ".swiper-button-next",prevEl: ".swiper-button-prev", hideOnClick: true,},});</script></div><div class="mm-er"><div class="me-top"><p class="m-tmgj">天猫国际</p><p class="m-english">TMALL GLOBAL</p><img src="./img/波折.jpg" alt=""></div><img src="./img/二维码1.jpg" alt=""><div class="mm-2">畅享全球好货</div><div class="mm-3">正品保障，破损无忧，晚到必赔！</div></div></div></main><footer><div id="c" class="box"><img src="./img/美容.png" alt=""></div><div class="f-all"><ul><li><a href="">最热<span>HOT</span></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 class="f-tu"><div class="ft-1"><a href=""><img src="./img/化妆品.jpg" alt=""><div class="mr-"><div class="mr">美容护肤热卖品牌</div><div class="more">查看更多</div></div></a></div><div class="ft-2"><a href=""><div class="ft-21"><div>¥59 <del>¥199.0</del></div><img src="./img/化妆品1.png" alt=""></div><div class="ft-22"><div class="ft-221"><div>¥59 <del>¥199.0</del></div><img src="./img/化妆品2.png" alt=""></div><div class="ft-222"><div>¥59 <del>¥199.0</del></div><img src="./img/化妆品3.png" alt=""></div></div></a></div><div class="ft-3"><a href=""><div class="ft-31"><div>¥59 <del>¥199.0</del></div><img src="./img/化妆品4.png" alt=""></div><div class="ft-32"><div>¥59 <del>¥199.0</del></div><img src="./img/化妆品5.jpg" alt=""></div></a></div><div class="all"><div class="yuan1"></div><div class="l-font">BRAND <span> 美容护肤热卖平牌</span><div><ul><li id="a"><div class="yuan"></div><ul class="c"><li class="item1c"><a href=""><img src="./img/名牌1.png" alt=""><div class="hg">韩国LG旗下彩妆</div></a></li><li class="item1c"><img src="./img/名牌1.png" alt=""><div class="hg">韩国LG旗下彩妆</div><a href=""></a></li><li class="item1c"><img src="./img/名牌1.png" alt=""><div class="hg">韩国LG旗下彩妆</div><a href=""></a></li><li class="item1c"><img src="./img/名牌1.png" alt=""><div class="hg">韩国LG旗下彩妆</div><a href=""></a></li><li class="item1c"><img src="./img/名牌1.png" alt=""><div class="hg">韩国LG旗下彩妆</div><a href=""></a></li><li class="item1c"><img src="./img/名牌1.png" alt=""><div class="hg">韩国LG旗下彩妆</div><a href=""></a></li><li class="item1c"><img src="./img/名牌1.png" alt=""><div class="hg">韩国LG旗下彩妆</div><a href=""></a></li><li class="item1c"><img src="./img/名牌1.png" alt=""><div class="hg">韩国LG旗下彩妆</div><a href=""></a></li></ul><ul class="b"><li class="itemc"><a href=""><img src="./img/名牌2.jpg" alt=""><div class="hg">韩国LG旗下彩妆</div></a></li><li class="itemc"><a href=""><img src="./img/名牌2.jpg" alt=""><div class="hg">韩国LG旗下彩妆</div></a></li><li class="itemc"><a href=""><img src="./img/名牌2.jpg" alt=""><div class="hg">韩国LG旗下彩妆</div></a></li><li class="itemc"><a href=""><img src="./img/名牌2.jpg" alt=""><div class="hg">韩国LG旗下彩妆</div></a></li><li class="itemc"><a href=""><img src="./img/名牌2.jpg" alt=""><div class="hg">韩国LG旗下彩妆</div></a></li><li class="itemc"><a href=""><img src="./img/名牌2.jpg" alt=""><div class="hg">韩国LG旗下彩妆</div></a></li><li class="itemc"><a href=""><img src="./img/名牌2.jpg" alt=""><div class="hg">韩国LG旗下彩妆</div></a></li><li class="itemc"><a href=""><img src="./img/名牌2.jpg" alt=""><div class="hg">韩国LG旗下彩妆</div></a></li></ul></li></ul></div></div></div></footer><footer><div id="d" class="box"><img src="./img/my.png" alt=""></div><div class="f-all"><ul><li><a href="">最热<span>HOT</span></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 class="f-tu"><div class="ft-1"><a href=""><img src="./img/my-1.jpg" alt=""><div class="mr-"><div class="mr">美容护肤热卖品牌</div><div class="more">查看更多</div></div></a></div><div class="ft-2"><a href=""><div class="ft-21"><div>¥59 <del>¥199.0</del></div><img src="./img/my-2.jpg" alt=""></div><div class="ft-22"><div class="ft-221"><div>¥59 <del>¥199.0</del></div><img src="./img/化妆品2.png" alt=""></div><div class="ft-222"><div>¥59 <del>¥199.0</del></div><img src="./img/化妆品3.png" alt=""></div></div></a></div><div class="ft-3"><a href=""><div class="ft-31"><div>¥59 <del>¥199.0</del></div><img src="./img/化妆品4.png" alt=""></div><div class="ft-32"><div>¥59 <del>¥199.0</del></div><img src="./img/化妆品5.jpg" alt=""></div></a></div><div class="all"><div class="yuan1"></div><div class="l-font">BRAND <span> 美容护肤热卖平牌</span><div><ul><li id="a"><div class="yuan"></div><ul class="c"><li class="item1c"><a href=""><img src="./img/名牌1.png" alt=""><div class="hg">韩国LG旗下彩妆</div></a></li><li class="item1c"><img src="./img/名牌1.png" alt=""><div class="hg">韩国LG旗下彩妆</div><a href=""></a></li><li class="item1c"><img src="./img/名牌1.png" alt=""><div class="hg">韩国LG旗下彩妆</div><a href=""></a></li><li class="item1c"><img src="./img/名牌1.png" alt=""><div class="hg">韩国LG旗下彩妆</div><a href=""></a></li><li class="item1c"><img src="./img/名牌1.png" alt=""><div class="hg">韩国LG旗下彩妆</div><a href=""></a></li><li class="item1c"><img src="./img/名牌1.png" alt=""><div class="hg">韩国LG旗下彩妆</div><a href=""></a></li><li class="item1c"><img src="./img/名牌1.png" alt=""><div class="hg">韩国LG旗下彩妆</div><a href=""></a></li><li class="item1c"><img src="./img/名牌1.png" alt=""><div class="hg">韩国LG旗下彩妆</div><a href=""></a></li></ul><ul class="b"><li class="itemc"><a href=""><img src="./img/名牌2.jpg" alt=""><div class="hg">韩国LG旗下彩妆</div></a></li><li class="itemc"><a href=""><img src="./img/名牌2.jpg" alt=""><div class="hg">韩国LG旗下彩妆</div></a></li><li class="itemc"><a href=""><img src="./img/名牌2.jpg" alt=""><div class="hg">韩国LG旗下彩妆</div></a></li><li class="itemc"><a href=""><img src="./img/名牌2.jpg" alt=""><div class="hg">韩国LG旗下彩妆</div></a></li><li class="itemc"><a href=""><img src="./img/名牌2.jpg" alt=""><div class="hg">韩国LG旗下彩妆</div></a></li><li class="itemc"><a href=""><img src="./img/名牌2.jpg" alt=""><div class="hg">韩国LG旗下彩妆</div></a></li><li class="itemc"><a href=""><img src="./img/名牌2.jpg" alt=""><div class="hg">韩国LG旗下彩妆</div></a></li><li class="itemc"><a href=""><img src="./img/名牌2.jpg" alt=""><div class="hg">韩国LG旗下彩妆</div></a></li></ul></li></ul></div></div></div></footer><footer><div id="e" class="box"><img src="./img/yybj.png" alt=""></div><div class="f-all"><ul><li><a href="">最热<span>HOT</span></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 class="f-tu"><div class="ft-1"><a href=""><img src="./img/yy-1.jpg" alt=""><div class="mr-"><div class="mr">美容护肤热卖品牌</div><div class="more">查看更多</div></div></a></div><div class="ft-2"><a href=""><div class="ft-21"><div>¥59 <del>¥199.0</del></div><img src="./img/yy-2.png" alt=""></div><div class="ft-22"><div class="ft-221"><div>¥59 <del>¥199.0</del></div><img src="./img/化妆品2.png" alt=""></div><div class="ft-222"><div>¥59 <del>¥199.0</del></div><img src="./img/化妆品3.png" alt=""></div></div></a></div><div class="ft-3"><a href=""><div class="ft-31"><div>¥59 <del>¥199.0</del></div><img src="./img/化妆品4.png" alt=""></div><div class="ft-32"><div>¥59 <del>¥199.0</del></div><img src="./img/化妆品5.jpg" alt=""></div></a></div><div class="all"><div class="yuan1"></div><div class="l-font">BRAND <span> 美容护肤热卖平牌</span><div><ul><li id="a"><div class="yuan"></div><ul class="c"><li class="item1c"><a href=""><img src="./img/名牌1.png" alt=""><div class="hg">韩国LG旗下彩妆</div></a></li><li class="item1c"><img src="./img/名牌1.png" alt=""><div class="hg">韩国LG旗下彩妆</div><a href=""></a></li><li class="item1c"><img src="./img/名牌1.png" alt=""><div class="hg">韩国LG旗下彩妆</div><a href=""></a></li><li class="item1c"><img src="./img/名牌1.png" alt=""><div class="hg">韩国LG旗下彩妆</div><a href=""></a></li><li class="item1c"><img src="./img/名牌1.png" alt=""><div class="hg">韩国LG旗下彩妆</div><a href=""></a></li><li class="item1c"><img src="./img/名牌1.png" alt=""><div class="hg">韩国LG旗下彩妆</div><a href=""></a></li><li class="item1c"><img src="./img/名牌1.png" alt=""><div class="hg">韩国LG旗下彩妆</div><a href=""></a></li><li class="item1c"><img src="./img/名牌1.png" alt=""><div class="hg">韩国LG旗下彩妆</div><a href=""></a></li></ul><ul class="b"><li class="itemc"><a href=""><img src="./img/名牌2.jpg" alt=""><div class="hg">韩国LG旗下彩妆</div></a></li><li class="itemc"><a href=""><img src="./img/名牌2.jpg" alt=""><div class="hg">韩国LG旗下彩妆</div></a></li><li class="itemc"><a href=""><img src="./img/名牌2.jpg" alt=""><div class="hg">韩国LG旗下彩妆</div></a></li><li class="itemc"><a href=""><img src="./img/名牌2.jpg" alt=""><div class="hg">韩国LG旗下彩妆</div></a></li><li class="itemc"><a href=""><img src="./img/名牌2.jpg" alt=""><div class="hg">韩国LG旗下彩妆</div></a></li><li class="itemc"><a href=""><img src="./img/名牌2.jpg" alt=""><div class="hg">韩国LG旗下彩妆</div></a></li><li class="itemc"><a href=""><img src="./img/名牌2.jpg" alt=""><div class="hg">韩国LG旗下彩妆</div></a></li><li class="itemc"><a href=""><img src="./img/名牌2.jpg" alt=""><div class="hg">韩国LG旗下彩妆</div></a></li></ul></li></ul></div></div></div></footer><footer><div id="f" class="box"><img src="./img/grhl.png" alt=""></div><div class="f-all"><ul><li><a href="">最热<span>HOT</span></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 class="f-tu"><div class="ft-1"><a href=""><img src="./img/gr-1.jpg" alt=""><div class="mr-"><div class="mr">美容护肤热卖品牌</div><div class="more">查看更多</div></div></a></div><div class="ft-2"><a href=""><div class="ft-21"><div>¥59 <del>¥199.0</del></div><img src="./img/gr-2.jpg" alt=""></div><div class="ft-22"><div class="ft-221"><div>¥59 <del>¥199.0</del></div><img src="./img/化妆品2.png" alt=""></div><div class="ft-222"><div>¥59 <del>¥199.0</del></div><img src="./img/化妆品3.png" alt=""></div></div></a></div><div class="ft-3"><a href=""><div class="ft-31"><div>¥59 <del>¥199.0</del></div><img src="./img/化妆品4.png" alt=""></div><div class="ft-32"><div>¥59 <del>¥199.0</del></div><img src="./img/化妆品5.jpg" alt=""></div></a></div><div class="all"><div class="yuan1"></div><div class="l-font">BRAND <span> 美容护肤热卖平牌</span><div><ul><li id="a"><div class="yuan"></div><ul class="c"><li class="item1c"><a href=""><img src="./img/名牌1.png" alt=""><div class="hg">韩国LG旗下彩妆</div></a></li><li class="item1c"><img src="./img/名牌1.png" alt=""><div class="hg">韩国LG旗下彩妆</div><a href=""></a></li><li class="item1c"><img src="./img/名牌1.png" alt=""><div class="hg">韩国LG旗下彩妆</div><a href=""></a></li><li class="item1c"><img src="./img/名牌1.png" alt=""><div class="hg">韩国LG旗下彩妆</div><a href=""></a></li><li class="item1c"><img src="./img/名牌1.png" alt=""><div class="hg">韩国LG旗下彩妆</div><a href=""></a></li><li class="item1c"><img src="./img/名牌1.png" alt=""><div class="hg">韩国LG旗下彩妆</div><a href=""></a></li><li class="item1c"><img src="./img/名牌1.png" alt=""><div class="hg">韩国LG旗下彩妆</div><a href=""></a></li><li class="item1c"><img src="./img/名牌1.png" alt=""><div class="hg">韩国LG旗下彩妆</div><a href=""></a></li></ul><ul class="b"><li class="itemc"><a href=""><img src="./img/名牌2.jpg" alt=""><div class="hg">韩国LG旗下彩妆</div></a></li><li class="itemc"><a href=""><img src="./img/名牌2.jpg" alt=""><div class="hg">韩国LG旗下彩妆</div></a></li><li class="itemc"><a href=""><img src="./img/名牌2.jpg" alt=""><div class="hg">韩国LG旗下彩妆</div></a></li><li class="itemc"><a href=""><img src="./img/名牌2.jpg" alt=""><div class="hg">韩国LG旗下彩妆</div></a></li><li class="itemc"><a href=""><img src="./img/名牌2.jpg" alt=""><div class="hg">韩国LG旗下彩妆</div></a></li><li class="itemc"><a href=""><img src="./img/名牌2.jpg" alt=""><div class="hg">韩国LG旗下彩妆</div></a></li><li class="itemc"><a href=""><img src="./img/名牌2.jpg" alt=""><div class="hg">韩国LG旗下彩妆</div></a></li><li class="itemc"><a href=""><img src="./img/名牌2.jpg" alt=""><div class="hg">韩国LG旗下彩妆</div></a></li></ul></li></ul></div></div></div></footer><div class="last-all"><div class="tm-last"><div class="left"><div class="tml-1"><img src="./img/天猫国际2.png" alt=""></div><div class="tml-2">工作时间：09:00-24:00(周一到周日)</div><div class="tml-3"><a href=""><i class="fa fa-user-circle-o" aria-hidden="true"></i>买家在线咨询</a></div><div class="tml-4"><a href=""><i class="fa fa-commenting-o" aria-hidden="true"></i>问题反馈</a></div><div class="tml-er"><img src="./img/l二维码.png" alt="">扫一扫，品质在手</div></div><div class="right"><ul><li><a href="">服务保障</a><ul><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></li><li><a href="">消费者指南</a><ul><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></li><li><a href="">支付方式</a><ul><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></li><li><a href="">商家支持</a><ul><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></li></ul></div><div class="bottom"><div class="b-cen"><p> 阿里巴巴集团 淘宝网 天猫 聚划算 全球速卖通 阿里巴巴国际交易市场 1688 阿里妈妈 去啊 阿里云计算 YunOS 阿里通信 万网 高德 优视 友盟 酷盘 虾米 天天动听 来往 支付宝 钉钉</p><span> © 2013-2016 Tmall.hk. 版权所有</span></div></div></div></div></div>
</body></html>css段代码如下
* {margin: 0;padding: 0;text-decoration: none;list-style: none;
}html {height: 100%;width: 100%;}/* 全文 */nav {height: 27px;width: 100%;background-color: #F2F2F2;position: relative;
}nav a {color: #999999;
}.nav-center {width: 1190px;height: 26px;margin: 0 auto;/* background-color: red; */
}.nav-left li,
.nav-left img {float: left;margin-left: 20px;}.nav-left a,
.nav-right li {font-size: 12px;line-height: 27px;
}.nl-home {width: 89px;
}.nav-left img {margin-top: 10px;width: 12px;
}/* 左导航栏 */
.nav-right li {float: right;margin: 0 5px;text-align: center;
}.nav-right .nav-long {height: 14px;width: 1px;background-color: #999999;margin: 7px -0px 0px;float: left;
}.fa-mobile {font-size: 16px;vertical-align: middle;
}.nav-sanjiao {height: 0px;width: 0px;border: 3px solid #999999;border-color: #999999 transparent transparent transparent;position: relative;top: 9px;left: 1px;
}.nav-right i {color: red;width: 12px;
}/* nav hover效果 */
nav a:hover {text-decoration: underline;color: red;
}.my-tb {width: 62px;height: 28px;border: 1px solid #F2F2F2;border-color: white #F2F2F2 white #F2F2F2;position: relative;}.my-tb:hover {background-color: white;
}.mt-tb:hover .xuan {transform: rotate(90deg);
}.my-tb1 {width: 76px;height: 57px;padding-left: 10px;margin-left: -1px;border-color: white #F2F2F2 #F2F2F2 #F2F2F2;border: 1px solid #F2F2F2;margin-top: -1px;visibility: hidden;z-index: 2;background-color: white;
}.my-tb:hover .my-tb1 {visibility: visible;
}.my-tb1 li {width: 96px;height: 28px;float: left;margin-left: -14px;text-align: center;visibility: hidden;
}.my-tb:hover .my-tb1 li {visibility: visible;
}/* 下拉· */
.nav-tu1{position: relative;
}
.nav-tu{}
.nav-tu li {position: absolute;width: 175px;height: 227px;background-color: red;z-index: 5;text-align: center;background: url(./img/二维码.png) no-repeat white;background-size: 175px;visibility: hidden;position: absolute;left: -60px;box-shadow: 1px 1px 10px #999;
}.nav-tu img {margin-top: 185px;
}.nav-tu1:hover .nav-tu li {visibility: visible;
}.nav-tu1:hover .tu-sj {visibility: visible;
}.tu-sj {position: absolute;left:20px;border: 8px solid yellow;border-color: transparent transparent white transparent;top: 12px;z-index: 6;visibility: hidden;
}/* 上面是下拉二维码 */
/* 右导航栏 */
.h-all,
.f-all {width: 1190px;height: 120px;margin: 0 auto;line-height: 120px;/* background-color: aquamarine; */
}.header-left {float: left;
}.h-img1 {height: 40px;float: left;margin: 35px 20px 0 0;
}.h-img2 {height: 16px;
}.header-right {float: right;margin-top: 42px;
}.hr-1 {height: 30px;width: 347px;border: 3px solid #7A45E5;float: left;z-index: 1;
}.hr-2 {height: 36px;width: 90px;background: linear-gradient(to right, #7A45E5, #B23CEF);float: right;
}.hr-2 span {float: left;margin: -40px 0 -0 25px;color: white;
}/* 头部 */
.main-head {height: 38px;border-bottom: 1px solid #7A45E5;}.main-head a {color: black;
}.main-center {height: 38px;width: 1190px;margin: 0 auto;/* background-color: yellow; */
}.main-head li {height: 38px;line-height: 38px;float: left;font-size: 14px;}.mh-one {width: 180px;background: linear-gradient(to right, #7A45E5, #B23CEF);/* text-align: center; */padding-left: 20px;
}.mh-one a {color: white;
}.mh-two {width: 120px;font-weight: bold;text-align: center;/* background-color: red; */
}.mh-two a {color: #7A45E5;
}.mh-three {width: 56px;margin-right: 40px;
}/* 上面导航 */
.main-main {width: 1190px;margin: 0 auto;position: relative;
}.mm li {width: 200px;height: 84px;background-color: #333333;
}/* 下面横拉 */
.item {width: 640px;background-color: white;position: absolute;left: 200px;z-index: 60;visibility: hidden;padding: 0 30px;
}.i0 {height: 509px;
}.it3,
.it4,
.it5 {float: right;
}.mm-1:hover .item {visibility: visible;
}.item12 a:hover {text-decoration: underline;color: red;
}.mm-22:hover .item {visibility: visible;
}.i1 {height: 584px;top: 0px;
}.i2 {height: 470px;top: 0px;
}.mm-3:hover .item {visibility: visible;
}.i3 {height: 507px;top: 0px;
}.mm-4:hover .item {visibility: visible;
}.i4 {height: 470px;top: 0px;
}.mm-5:hover .item {visibility: visible;
}.item-1 {height: 140px;width: 300px;/* background-color: red; */z-index: 19;margin: 15px 10px;float: left;}.item-11 {width: 300px;height: 30px;font-weight: bold;border-bottom: 1px solid black;color: #333333;
}.item12 {width: 300px;height: 90px;/* background-color: blueviolet; */
}.item12 a {text-indent: 0;margin: 4px 4px 4px 0;float: left;color: #666666;/* background-color: yellow; */
}.nl1 {float: left;margin: 7px 8px 0;
}.item12 .i-red {color: red;z-index: 20;
}.it2 {position: absolute;top: 100px;
}.it3,
.it4,
.it5 {float: right;
}.mm>li>a {display: block;width: 160px;margin: 0 auto;color: white;border-bottom: 1px dotted #545454;
}.mm-tu img {width: 24px;float: left;margin-top: 20px;
}.tu-font {font-size: 16px;float: left;font-weight: bold;margin: 15px 10px;
}/* .mm .fu {position: absolute;top: 0px;left: 570px;z-index: 50;background-color: transparent;visibility: hidden;
} */.mm-1:hover .fu {visibility: visible;
}.font {font-size: 12px;float: left;
}.mm-1 a {border: none;
}/* 左边导航 */
.lbt {width: 750px;height: 420px;position: absolute;top: 0px;left: 200px;/* background-color: red; */
}html,
body {position: relative;height: 100%;
}body {background: #eee;font-family: Helvetica Neue, Helvetica, Arial, sans-serif;font-size: 14px;color: #000;margin: 0;padding: 0;
}.hr-2 {font-size: 16px;/* font-weight: bold; */
}.swiper-slide {text-align: center;font-size: 18px;background: #fff;/* Center slide text vertically */display: -webkit-box;display: -ms-flexbox;display: -webkit-flex;display: flex;-webkit-box-pack: center;-ms-flex-pack: center;-webkit-justify-content: center;justify-content: center;-webkit-box-align: center;-ms-flex-align: center;-webkit-align-items: center;align-items: center;
}.swiper-slide img {display: block;width: 100%;height: 100%;object-fit: cover;
}/* swiper轮播图 */
.mm-er {width: 240px;height: 420px;/* background-color: red; */position: absolute;top: 0px;left: 950px;
}.me-top {height: 120px;/* background-color: teal; */
}.mm-er p {color: #7A45E5;text-align: center;font-weight: bold;
}.m-tmgj {font-size: 18px;padding-top: 30px;
}.m-english {font-size: 20px;margin-top: 10px;
}.me-top img {height: 11px;margin-top: 20px;margin-left: 100px;
}.mm-er>img {margin: 10px 0 10px 20px;
}.mm-2 {font-size: 14px;font-weight: bold;text-align: center;margin-bottom: 10px;
}.mm-3 {font-size: 12px;text-align: center;
}/* 中部主体 */
header,
.main-head {background-color: white;
}body {background-color: #F5F5F5;
}.box {width: 600px;height: 40px;margin: 0 auto;/* background-color: red; */padding-left: 400px;margin-top: 30px;margin-bottom: -30px;
}.f-all {height: 475px;width: 1200px;margin-top: 30px;background-color: white;position: relative;text-align: center;padding-right: 20px;
}footer ul {padding: 15px;width: 117px;height: 475px;float: left;/* background-color: red; */
}footer a {color: black;
}footer li {line-height: 17px;margin-top: 15px;font-size: 12px;
}.f-tu {width: 1040px;height: 474px;/* background-color: #545454; */float: right;
}.f-tu img {margin-left: -40px;
}.ft-1 {width: 192px;height: 474px;border: 1px solid transparent;/* background-color: green; */
}.ft-1 img{margin-left: 0px;
}
.ft-2 {width: 398px;height: 474px;border: 1px solid #E8E8E8;position: absolute;top: 0px;left: 352px;
}.ft-21 {height: 238px;border: 1px solid #E8E8E8;
}.ft-21 img {height: 211px;float: right;margin-top: 10px;margin-right: 10px;
}.ft-21 div {width: 111px;float: left;margin: 90px 0 0 50px;font-size: 18px;color: orange;/* background-color: yellow; */
}del {font-size: 13px;color: #A6A6A6;text-decoration: line-through;
}.ft-221 {width: 199px;height: 231px;border: 1px solid #E8E8E8;float: left;
}.ft-221 img {margin: 20px;width: 160px;float: right;
}.ft-221 div {height: 18px;width: 111px;position: absolute;top: 390px;left: 60px;font-size: 18px;color: orange;/* background-color: yellow; */
}.ft-222 img {width: 160px;position: absolute;top: 270px;left: 260px;
}.ft-222 div {height: 18px;width: 111px;position: absolute;top: 390px;left: 260px;font-size: 18px;color: orange;
}.ft-3 {width: 200px;height: 474px;border: 1px solid transparent;position: absolute;left: 750px;top: 0px;
}.ft-31 {height: 237px;border: 1px solid #E8E8E8;
}.ft-31 img {width: 160px;position: absolute;top: 20px;left: 60px;
}.ft-31 div {position: absolute;top: 140px;left: 65px;
}.ft-32 {height: 234px;border: 1px solid #E8E8E8;
}.ft-32 img {width: 160px;position: absolute;top: 260px;left: 60px;
}.ft-32 div {position: absolute;top: 380px;left: 65px;
}.mr- {position: absolute;top: 350px;text-align: center;
}.mr {font-size: 20px;color: white;margin-left: 0px;margin-bottom: -40px;
}.more {font-size: 12px;color: white;width: 80px;margin: 0 40px;border: 1px solid white;border-color: white transparent white transparent;line-height: 30px;
}/* 底部，未完成 *//* 图片右动 */.ft-3 img:hover {left: 10px;
}.ft-21 img:hover {position: absolute;right: 5px;
}.ft-221 img:hover {position: absolute;left: 5px;
}.ft-222 img:hover {position: absolute;left: 255px;
}.ft-32 img:hover {position: absolute;left: 50px;
}.ft-31 img:hover {position: absolute;left: 50px;
}.all {height: 475px;width: 279px;border: 1px solid #E8E8E8;margin: 0 auto;background-color: #FFFFFF;position: absolute;top: 0px;left: 951px;z-index: 99;
}.itemc,
.item1c {height: 87px;width: 130px;float: left;margin: 3px;}.itemc {background-color: #FFFFFF;visibility: hidden;z-index: 99;
}.b,
.c {position: absolute;height: 260px;width: 260px;border-radius: 5px;}.item1c {background-color: #FFFFFF;
}#a:hover .itemc {visibility: visible;transition: 1s;
}.yuan,
.yuan1 {width: 10px;height: 10px;background-color: red;border-radius: 5px;position: absolute;top: 450px;left: 150px;
}.yuan1 {left: 120px;
}.b,
.c {padding: 0px;width: 279px;margin-left: -21px;margin-top: -10px;}.l-font {font-size: 22px;color: #999;/* background-color: red; */line-height: 41px;width: 256px;text-align: center;margin-left: 10px;border-bottom: 1px solid #737373;
}.l-font span {font-size: 18px;color: #999;
}.item1c img {width: 90px;margin-left: 10px;
}.hg {background-color: #EDEDED;width: 130px;color: #737373;
}.itemc img {width: 90px;margin-left: 10px;
}.ce-2 {border: 1px solid #5C2694;color: #5C2694;box-sizing: border-box;height: 40px;line-height: 20px;border-top: transparent;text-align: center;margin-top: 2px;width: 38px;font-size: 14px;background-color: white;float: right;transition: all .2s;/* visibility: hidden; */
}aside li:hover {visibility: visible;transform: translateX(-40px);/* display: block; */
}aside {width: 41px;/* background-color: #ccc; */height: 370px;line-height: 20px;margin: 0 auto;margin-top: 150px;/* 开启固定定位 */position: fixed;position: sticky;top: 240px;right: 60px;float: right;
}aside img {width: 40px;float: left;transition: all 1s;
}aside li {margin: -5px 0 -5px -2px;/* float: right; */width: 80px;transition: all .5s;overflow: hidden;background-color: #545454;
}aside ul {width: 38px;overflow: hidden;/* display: block; */
}.i2 .item-11 {font-size: 14px;text-align: left;
}.i2 {font-size: 14px;
}.xuan {/* background-color: red; *//* color: green; */
}.mt-tb:hover .xuan {transform: rotate(90deg);
}.last-all {width: 100%;height: 394px;background: linear-gradient(to right, #7A45E5, #B23CEF);margin-top: 20px;
}.last-all .tm-last {width: 1190px;height: 354px;margin: 0 auto;/* background-color: #F5F5F5; */padding-top: 40px;position: relative;
}.tm-last .left {height: 250px;float: left;/* background-color: #5C2694; */
}.tm-last .left div {margin: 0px 0px 20px;
}.tml-1 img {width: 160px;}.tm-last .left i {font-size: 20px;margin: 5px;
}.tml-2 {font-size: 12px;color: #eee;
}.tml-3 a,
.tml-4 a {font-size: 14px;color: #eee;
}.tml-er {height: 112px;width: 112px;background-color: #E8E8E8;border-radius: 3px;position: absolute;top: 40px;left: 240px;color: white;font-size: 12px;text-align: center;
}.tml-er img {height: 104px;margin: 4px;
}
.tm-last .right{float: right;
}
.tm-last .right>ul>li{float: left;}
.tm-last .right>ul>li>a{color: white;font-size: 18px;font-weight: bold;margin-left: 80px;
}
.tm-last .right>ul>li>ul>li>a{margin-left: 80px;color: #C0A6F2;font-size: 12px;}
.tm-last .right>ul>li>ul>li{margin-top: 5px;
}
.tm-last .right>ul>li>ul>li:hover{text-decoration: underline;
}
.tm-last .bottom{height: 104px;width: 1190px;/* background-color: aquamarine; */display: inline-block;
}
.tm-last .b-cen{height: 52px;/* background-color: #5C2694; */margin-top: 26px;border-top: 1px solid white;
}
.tm-last .b-cen p,
.tm-last .b-cen span{font-size: 12px ;color: #C0A6F2;margin: 0 1px 0 4px;line-height: 26px;
}
.tm-last .b-cen p{margin-top: 10px;
}因效果图放上会被违规就不放了
大家可以搜索天猫国际
和原网站90%相似
H5C3第二个完整大项目————天猫国际首页跳转登录页相关推荐
- H5C3第一个完整大项目————三国杀登录页跳转游卡官网
本次展示一下游卡官网的代码与成果图 成果图如下 其中业务板块可以悬停切换图片与下面内容 代码如下 html代码 <!DOCTYPE html> <html lang="en ...
- 解决vue项目路由拦截跳转登录页错误
报错信息:vue-router.esm.js?8c4f:2065 Uncaught (in promise) Error: Redirected when going from "/home ...
- 简单几步骤查看天猫国际同行大量商品的发布、下架时间
宝贝上下架时间,顾名思义就是你宝贝上架的时间和下架的时间段,淘宝宝贝上下架时间是非常重要的,不管对任何级别的店铺都尤其重要.那么该如何快速查询天猫国际同行中多个商品的发布.下架时间呢?下面随小编一起用 ...
- 澳洲大药房天猫618战绩：爆款面霜销量够一个妹子用13个世纪
昨晚,澳洲大药房Chemist Warehouse(以下简称"澳洲大药房")发布天猫618理想生活狂欢节战报.战报显示,6月18日当天,澳洲大药房仅用三分钟便突破100万销售额,1 ...
- 【项目记录/vue移动端】仿京东到家登录页
3-1 登陆页面布局开发 视口(Viewport) 目的:让手机的小屏幕尽可能完整显示整个网页,即实现理想视口 1)布局视口layout viewport iOS, Android 都将布局视口分辨率 ...
- 签约大项目，展示新技术，寻找新商机——全球名企挤爆第二届进博会
举世瞩目的第二届中国国际进口博览会已于11月5日盛大开幕. 本届进博会,参会各大企业纷纷亮出各自代表行业顶级发展水平的尖端技术,发布面向未来的科技创新产品,签约加码在华合作,展示对中国市场的密切关注和 ...
- 大数据应用项目创新大赛_第二届海南大数据创新应用大赛收官
来源:新华网 第二届海南大数据创新应用大赛颁奖仪式现场.新华网发 6月7日,第二届海南大数据创新应用大赛颁奖仪式举行,历经半年角逐,第二届海南大数据创新应用大赛收官.本届大赛总共吸引1664支队伍参赛 ...
- 大型互联网企业大流量高并发电商领域核心项目已上线(完整流程+项目白皮书)
说在前面的话 面对近年来网络的飞速发展,大家已经都习惯了网络购物,从而出现了一些衍生品例如:某宝/某东/拼夕夕等大型网站以及购物APP~ 并且从而导致很多大型互联网企业以及中小厂都需要有完整的项目经验 ...
- 区块链在天猫国际商品溯源中的应用
https://yq.aliyun.com/articles/348787?utm_content=m_40006 背景 天猫国际正在全面启动全球溯源计划--将利用区块链技术.药监码技术以及大数据跟踪 ...
- 深度 | 区块链在天猫国际商品溯源中的应用
本文作者:天猫进出口技术 团队简介:作为阿里巴巴三大重要战略之一的国际化先锋战队,承担着促进集团国际化的艰巨任务.我们通过技术驱动云.网.端的跨境技术体系落地.通过跨境供应链体系重新定义未来全球化的贸 ...
最新文章
- 【ZT】我家宝宝不会哭----分享在美国养孩子的妈妈经（必看）
- Silverlight 游戏开发小技巧：角色升级特效
- 3. nginx的请求转发算法，如何配置根据权重转发
- android仿微信图片上传进度,android高仿微信发布动态(选择图片)
- jsp接收 input文本输入框中，无法正确显示单引号和双引号的问题
- SAP UI5 视图如何使用工程里的 sample data 作为 JSON model 的数据源
- 通过syslog接收远程日志
- 惠州交警携手高德地图 引导市民智慧出行
- ReactiveX流式编程—从xstream讲起
- POJ3349 Snowflake Snow Snowflakes(哈希表)
- android实时声音信号波形_电子设计竞赛教程-信号源类
- 区块链 Fisco bcos 智能合约（12）-Solidity的基础特性
- Unity 3D下载安装教程
- 用python画奥特曼_你都用 Python 来做什么？
- 新能源汽车车载智能终端t-box
- [LaTex报错解决]Unicode character ， (U+FF0C)
- WordPress 主题和插件
- mysql 1.4安装步骤_从零开始搭建系统1.4——MySql安装及配置
- 微信公众号可以改名称了，只限个人订阅号！
- android培训讲师介绍,安卓培训讲师浅析android项目重点知识