文章
文章用户商铺文档快讯圈子网址导航

模仿实现主流网页

释放双眼，带上耳机，听听看~！

码云链接：https://gitee.com/tangqingao/webpage_imitation.git

模仿实现主流网页

 

注意：本网页是模仿淘宝网页，由于完全还原过于困难，就选取了里面简单的几个样式。并在里面添加了几个动画效果，例如，字体自动变色，淘宝logo沿着X轴左右移动，一个绿色的小方块来回自转，将鼠标放到电脑商品图上，图片会变大等等。还有，打开网页30s后有惊喜。

<!DOCTYPE html>

<html>

 <head>

  <meta http-equiv=\"refresh\" content=\"30;url=https://www.taobao.com/\">

  <meta http-equiv=\"content-type\" content=\"text/html;text/html; charset=UTF-8\" />

  <title>Computers.html</title>

        <style type=\"text/css\">

   .logo{height: 44px;width: 120px;float: left;

    animation: logo 2s ease-in-out 0.5s infinite alternate;

    -webkit-animation: logo 2s ease-in-out 0.5s infinite alternate;

    -moz-animation: logo 2s ease-in-out 0.5s infinite alternate;

   }

   @keyframes logo{

    from{transform: translateX(0px);}

    to{transform: translateX(100px);}

   }

   @-webkit-keyframes logo{

    from{transform: translateX(0px);}

    to{transform: translateX(100px);}

   }

   @-moz-keyframes logo{

    from{transform: rotateX(0px);}

    to{transform: rotateX(100px);}

   }

   .box{float: right; border: orangered solid 2px;width: 514px;display: inline-block;}

   .box1{width: 80px;height: 34px;border: #f5f5f5 solid 1px;background-color: #f5f5f5;font:12px/1.5 arial,\'Hiragino Sans GB\',\"\\5b8b\\4f53\",sans-serif;color:#6b6b6b; line-height: 20px;text-indent: 15px;}

   .box2{width: 350px;height: 31px;border: #F5F5F5 1px solid;padding: 0px;}

   .box3{width: 82px;height: 35px; background-color: orangered; border:0px;  font-size: 18px;font-family: arial,\'Hiragino Sans GB\',\"\\5b8b\\4f53\",sans-serif;color: white;}

   .spinner{width: 60px; height: 60px; background-color: #67CF22;margin: 20px 0px 0px 900px;

    animation: box 1.2s infinite ease-in-out alternate;

    -webkit-animation: box 1.2s infinite ease-in-out alternate;

    -moz-animation: box 1.2s infinite ease-in-out alternate;

   }

   @-webkit-keyframes box {

    0% { transform: perspective(120px) }

    50% { transform: perspective(120px) rotateY(180deg) }

    100% { transform: perspective(120px) rotateY(180deg)  rotateX(180deg) }

   }

   

   @keyframes box {

    0% {transform: perspective(120px);transform: perspective(120px)} 

    50% {transform: perspective(120px) rotateX(-180deg) ;transform: perspective(120px) rotateX(-180deg) }

    100% {transform: perspective(120px) rotateX(-180deg) rotateY(-180deg);transform: perspective(120px) rotateX(-180deg) rotateY(-180deg);}

   }

   @-moz-keyframes box {

    0% {transform: perspective(120px);transform: perspective(120px)} 

    50% {transform: perspective(120px) rotateX(-180deg) ;transform: perspective(120px) rotateX(-180deg) }

    100% {transform: perspective(120px) rotateX(-180deg) rotateY(-180deg);transform: perspective(120px) rotateX(-180deg) rotateY(-180deg);}

   }

   .inner{width: 1000px; overflow: hidden;padding:12px 19px;border: #e8e8e8 solid 1px;margin: 0px;font: 12px/1.5 arial,\'Hiragino Sans GB\',\"\\5b8b\\4f53\",sans-serif;}

   .item{font: 12px/1.5 arial,\'Hiragino Sans GB\',\"\\5b8b\\4f53\",sans-serif;}

   .species{margin-left: 20px;}

   .species:link,.species:visited{text-decoration: none;color: #6c6c6c;}

   .species:hover{text-decoration: underline;color: #FF4500;}

   .filtrate{width: 1038px;height: 39px;border: #E8E8E8 solid 1px;margin-top: 10px;background-color: #f5f5f5;}

   .J_Ajax{float: left;height: 39px;padding: 0px 19px;line-height: 39px;background-color: #f5f5f5;}

   .J_Ajax:link,.J_Ajax:visited{text-decoration: none;color: #6c6c6c;}

   .J_Ajax:hover{text-decoration: none;color: #FF4500;background-color: #FFFFFF;border-right: solid 1px #f5f5f5;border-left: solid 1px #f5f5f5;}

   .section{height: 39px;width: 130px; margin-left: 300px; font: 12px/1.5 tahoma,arial,\'Hiragino Sans GB\',\'\\5b8b\\4f53\',sans-serif;color: #404040;}

   .price_section{width: 45px;height: 21px;margin-top: 0; font: 12px/1.5 tahoma,arial,\'Hiragino Sans GB\',\'\\5b8b\\4f53\',sans-serif;padding: 0 4px 0 4px; border: solid 1px #dfdfdf;display: list-item;list-style: none;}

   .sect{float: left;width: 55px; }

   .condition{float: left;width: 120px;height: 20px; font: 12px/1.5 tahoma,arial,\'Hiragino Sans GB\',\'\\5b8b\\4f53\',sans-serif;line-height: 10px;text-align: left;margin-top: -5px;}

   .title{height: 30px;width: 825px;border: orangered 1px solid;background-color: lightcyan; line-height: 30px;text-align: center;margin-top: 1.5%;}

   .ensemble{border: bisque 1px solid; float: left;margin-top: 25px;}

   .list{height: 350px;width: 30px;border: #FFA500 1px solid; background-color: black;color: white;float: left;list-style: none;

    -webkit-animation: series 4s ease-in-out 0.5s infinite alternate; 

    animation: series 4s ease-in-out 0.5s infinite alternate;

    -moz-animation: series 4s ease-in-out 0.5s infinite alternate;

   }

   @-moz-keyframes series{

    0%{color: white;}

    15%{color: aqua;}

    30%{color: greenyellow;}

    45%{color: orangered;}

    60%{color: blue;}

    75%{color: red;}

    90%{color: darkorchid;}

    100%{color: black;}

   }

   @keyframes series{

    0%{color: white;}

    15%{color: aqua;}

    30%{color: greenyellow;}

    45%{color: orangered;}

    60%{color: blue;}

    75%{color: red;}

    90%{color: darkorchid;}

    100%{color: black;}

   }

   @-webkit-keyframes series{

    0%{color: white;}

    15%{color: aqua;}

    30%{color: greenyellow;}

    45%{color: orangered;}

    60%{color: blue;}

    75%{color: red;}

    90%{color: darkorchid;}

    100%{color: black;}

   }

   .ensemble .list li{text-align: center;line-height: 85px;font-size: 20px;}

   .series{float: left; border: lightgray 1px solid;width: 234.5px;height: 350px;}

   .series:hover{border-color: #FF4500;}

   .blank{height: 350px;width: 20px;color: #FFFFFF; float: left;}

   .series img,.ensemble img{max-height: 205px;max-width: 234px;min-height: 205px;min-width: 234px;}

   .price{color: orangered; font-size: 20px;font-family: \"楷体\";}

   .baoyou{background-color: orangered; width: 30px;height: 15px; font-size: 12px;text-align: center;color: #FFFFFF;}

   .name{ width: 30px;height: 15px; font-size: 12px;text-align: center;color: black;}

   .shopname{width: 30px;height: 15px; font-size: 12px;text-align: center;color: lightgray;}

   .line{width: 20px;color: #FF4500;float: left;}

   .l{width: 10px;height: 3px;float: left; background-color: #FF4500;margin-top: 2px; margin-left: 5px;}

   .ensemble div img{cursor: pointer;transition: all 0.6s;}

   .ensemble div img:hover{transform: scale(1.1);}

   .host{border-bottom: solid 1px #E8E8E8;height: 34px;width: 200px; line-height: 34px;margin-bottom: 13px;font-family:12px/1.5 arial,\'Hiragino Sans GB\',\"\\5b8b\\4f53\",sans-serif;text-align: left;margin-left: 1060px;}

   a:link{text-decoration: none;margin-bottom: 13px;}

   a:hover{color: orangered; text-decoration: underline;}

   </style>

 </head>

 <body>

  <form action=\"Computers.html\" method=\"get\">

  <div style=\"width: 800px; margin-top: 40px;display: inline-block;float: left;\">

   <div class=\"logo\"><img src=\"img/logo.png\" width=\"115px\" height=\"43px\" /></div>

   <div class=\"box\">

    <div style=\"float: left;\"><select class=\"box1\">

     <option>宝贝</option>

     <option>店铺</option>

    </select></div>

    <div style=\"float: left;\"><input class=\"box2\" type=\"text\" /></div>

    <div><input class=\"box3\" type=\"submit\" value=\"搜索\"/> </div>

   </div>

  </div>

  <div class=\"spinner\"></div>

  <div style=\"margin-top: 50px;\">

   <dl class=\"inner\">

    <dt style=\"float: left;color: #9A9A9A;white-space: nowrap;\">您是不是想找：</dt>

    <dd class=\"item\">

     <span class=\"species\">笔记本电脑</span>

     <span class=\"species\">台式电脑</span>

     <span class=\"species\">电脑主机</span>

     <span class=\"species\">苹果电脑</span>

     <span class=\"species\">外星人</span>

     <span class=\"species\">戴尔</span>

     <span class=\"species\">手提电脑</span>

     <span class=\"species\">游戏本</span>

     <span class=\"species\">联想电脑</span>

     <span class=\"species\">台式机</span>

     <span class=\"species\">平板电脑</span>

     <span class=\"species\">一体机</span>

     <span class=\"species\">游戏电脑</span>

     <span class=\"species\">华硕</span>

    </dd>

   </dl>

  </div>

  <div class=\"filtrate\">

   <div class=\"item J_Ajax\">综合排序</div>

   <div class=\"item J_Ajax\">销量</div>

   <div class=\"item J_Ajax\">信用</div>

   <div class=\"item J_Ajax\">价格</div>

   <div class=\"section\">

    <ul style=\"padding: 8px 0 0 10px; list-style: none;margin: 0;\">

     <li class=\"sect\"><input class=\"price_section\" placeholder=\"¥\" type=\"text\" /></li>

     <li style=\"width: 10px;text-align: center;display: list-item;float: left;\">-</li>

     <li class=\"sect\"><input class=\"price_section\" placeholder=\"¥\" type=\"text\"/></li>

    </ul>

   </div>

  </div>

  <div class=\"filtrate\">

   <ul style=\"list-style: none;\">

    <li class=\"condition\"><input type=\"checkbox\" />包邮</li>

    <li class=\"condition\"><input type=\"checkbox\" />赠送退货运费险</li>

    <li class=\"condition\"><input type=\"checkbox\" />货到付款</li>

    <li class=\"condition\"><input type=\"checkbox\" />公益宝贝</li>

    <li class=\"condition\"><input type=\"checkbox\" />二手</li>

    <li class=\"condition\"><input type=\"checkbox\" />天猫</li>

    <li class=\"condition\"><input type=\"checkbox\" />正品保障</li>

   </ul>

  </div>

  <div class=\"ensemble\">

   <div class=\"list\"><li>惠普系列</li></div>

   <div class=\"series\">

     <div><a href=\"https://detail.tmall.com/item.htm?id=586580762510&ali_refid=a3_430583_1006:1103182999:N:惠普暗影精灵4代:4aeb01f4453a9ac83bd5bac2bc90a399&ali_trackid=1_4aeb01f4453a9ac83bd5bac2bc90a399&spm=a230r.1.14.1&sku_properties=5919063:6536025\"><img src=\"img/HP1.jpg\"/></a></div>

     <div class=\"price\"><span>￥8688.00</span></div>   

     <div>

       <span class=\"baoyou\">包邮</span>&nbsp;

       <span><a class=\"name\" href=\"https://detail.tmall.com/item.htm?id=586580762510&ali_refid=a3_430583_1006:1103182999:N:惠普暗影精灵4代:4aeb01f4453a9ac83bd5bac2bc90a399&ali_trackid=1_4aeb01f4453a9ac83bd5bac2bc90a399&spm=a230r.1.14.1&sku_properties=5919063:6536025\" target=\"_blank\">HP/惠普&nbsp;暗影精灵&nbsp;4pro&nbsp;rtx2060笔记本&nbsp;144HZ电竞屏学生电脑手提15.6英寸</a></span>

     </div>

     <div style=\"width: 180px;\">

      <span class=\"line\">

       <span class=\"l\"></span>

       <span class=\"l\"></span>

       <span class=\"l\"></span>

      </span>

      <span><a class=\"shopname\" href=\"https://taoyoujism.tmall.com\">淘游记数码专营店</a></span>

     </div>

   </div>

   <div class=\"blank\"></div>

   <div class=\"series\">

    <div><a href=\"https://detail.tmall.com/item.htm?spm=a230r.1.14.101.2e334149fqcnGA&id=582165251620&ns=1&abbucket=1&sku_properties=5919063:6536025\"><img src=\"img/HP2.jpg\" /></a></div>

    <div class=\"price\"><span>￥7999.00</span></div>   

    <div>

     <span class=\"baoyou\">包邮</span>&nbsp;

     <span><a class=\"name\" href=\"https://detail.tmall.com/item.htm?spm=a230r.1.14.101.2e334149fqcnGA&id=582165251620&ns=1&abbucket=1&sku_properties=5919063:6536025\" target=\"_blank\">HP/惠普&nbsp;暗影精灵&nbsp;3代plus笔记本学生电脑&nbsp;游戏本</a></span>

    </div>

    <div style=\"width: 180px;\">

     <span class=\"line\">

      <span class=\"l\"></span>

      <span class=\"l\"></span>

      <span class=\"l\"></span>

     </span>

     <span><a class=\"shopname\" href=\"https://hpeks.tmall.com\">hp惠普尔卡圣专卖店</a></span>

    </div>

   </div>

   <div class=\"blank\"></div>

   <div class=\"series\">

    <div><a href=\"https://item.taobao.com/item.htm?spm=a230r.1.14.52.435842c36Bk5Mq&id=554520039064&ns=1&abbucket=1#detail\"><img src=\"img/HP3.jpg\" /></a></div>

    <div class=\"price\"><span>￥4399.00</span></div>

    <div>

     <span class=\"baoyou\">包邮</span>&nbsp;

     <span><a class=\"name\" href=\"https://item.taobao.com/item.htm?spm=a230r.1.14.52.435842c36Bk5Mq&id=554520039064&ns=1&abbucket=1#detail\" target=\"_blank\">HP/惠普&nbsp;暗影精灵2代&nbsp;AMD北极星453Proi7轻薄游戏本笔记本电脑</a></span>

    </div>

    <div style=\"width: 180px;\">

     <span class=\"line\">

      <span class=\"l\"></span>

      <span class=\"l\"></span>

      <span class=\"l\"></span>

     </span>

     <span><a class=\"shopname\" href=\"https://nb898.taobao.com\">guoms20081</a></span>

    </div>

   </div>

   <div class=\"blank\"></div>

   <div class=\"series\">

    <div><a href=\"https://click.simba.taobao.com/cc_im?spm=a230r.1.14.1&p=%BB%DD%C6%D5&s=1415065403&k=569&e=I2kGY1VY23ljCmoXTZzJYqKa5fwlXqJgzcSUVhtOJSA3OtiCijYGI%2BUL0z4bg51DFy5CxuTTkLxZVcXGaX5UNuiFvc5DYOpGN6IjuUkSYJt2pt9BNGapq9LoWiuFc4yX%2BAME12nit%2Fd6UbzbGiU6N%2BxwV%2BVVp3XJeLQIWkzKVpY3X6ZApm53Ywv2cQ5ryEeePadaFSu0TWbTMxriJOSBCLAvVooNIme4cknV2RXpIkfH%2Ff5Oi6MOylmRp%2BuA8PIQlmcYPLJlVbMzQ%2FaqZmsym6lvtES9QRclATawJIa1Mpr0mk%2BoK7IFI032cr8MhI8HoKhnRBZRZCGYpZWPLoIryUG3aTKuUz6FKI%2FJnREgRxnHuOKNvd5KJKPL45RETaekJrhfwyi%2FwidhigjKdvXoNzo6w6KNX0YAtVPyadwLvR0qWCDZ0aX42KlpmP5ooL7nLV3Chcp%2BP7Dg0AZrlzbzHlGUyifzDs7%2FkYQ6F1fst8sFzdbej8l9M1sVmdALOl5YJthvRohFQFlBcCUfmQ5D2MgkOdrcT%2FRmsHVKK9Di0YEOBS%2BgfdRMQA%3D%3D\"><img src=\"img/HP4.jpg\" /></a></div>

    <div class=\"price\"><span>￥5699.00</span></div>   

    <div>

     <span class=\"baoyou\">包邮</span>&nbsp;

     <span><a class=\"name\" href=\"https://click.simba.taobao.com/cc_im?p=%BB%DD%C6%D5&s=1415065403&k=569&e=I2kGY1VY23ljCmoXTZzJYqKa5fwlXqJgzcSUVhtOJSA3OtiCijYGI%2BUL0z4bg51DFy5CxuTTkLxZVcXGaX5UNuiFvc5DYOpGN6IjuUkSYJt2pt9BNGapq9LoWiuFc4yX%2BAME12nit%2Fd6UbzbGiU6N%2BxwV%2BVVp3XJeLQIWkzKVpY3X6ZApm53Ywv2cQ5ryEeePadaFSu0TWbTMxriJOSBCLAvVooNIme4cknV2RXpIkfH%2Ff5Oi6MOylmRp%2BuA8PIQlmcYPLJlVbMzQ%2FaqZmsym6lvtES9QRclATawJIa1Mpr0mk%2BoK7IFI032cr8MhI8HoKhnRBZRZCGYpZWPLoIryUG3aTKuUz6FKI%2FJnREgRxnHuOKNvd5KJKPL45RETaekJrhfwyi%2FwidhigjKdvXoNzo6w6KNX0YAtVPyadwLvR0qWCDZ0aX42KlpmP5ooL7nLV3Chcp%2BP7Dg0AZrlzbzHlGUyifzDs7%2FkYQ6F1fst8sFzdbej8l9M1sVmdALOl5YJthvRohFQFlBcCUfmQ5D2MgkOdrcT%2FRmsHVKK9Di0YEOBS%2BgfdRMQA%3D%3D\" target=\"_blank\">HP/惠普&nbsp;薄锐&nbsp;Envy13&nbsp;轻薄便携商务办公学生手提电</a></span>

    </div>

    <div style=\"width: 180px;\">

     <span class=\"line\">

      <span class=\"l\"></span>

      <span class=\"l\"></span>

      <span class=\"l\"></span>

     </span>

     <span><a class=\"shopname\" href=\"https://click.simba.taobao.com/cc_im?p=%BB%DD%C6%D5&s=1415065403&k=525&e=xtwnuYfOB6JjCmoXTZzJYqKa5fwlXqJgzcSUVhtOJSA3OtiCijYGI%2BUL0z4bg51DFy5CxuTTkLxmWp4LmxecsOiFvc5DYOpGN6IjuUkSYJt2pt9BNGapq9LoWiuFc4yX%2BAME12nit%2Fd6UbzbGiU6N%2BxwV%2BVVp3XJeLQIWkzKVpY3X6ZApm53Ywv2cQ5ryEeePadaFSu0TWbTMxriJOSBCLAvVooNIme4cknV2RXpIkfH%2Ff5Oi6MOylmRp%2BuA8PIQlmcYPLJlVbMzQ%2FaqZmsym6lvtES9QRclATawJIa1Mpr0mk%2BoK7IFI032cr8MhI8HoKhnRBZRZCGYpZWPLoIryUG3aTKuUz6FKI%2FJnREgRxnHuOKNvd5KJKPL45RETaekJrhfwyi%2FwidhigjKdvXoN7BLlGH2xGxSvHboD76rF2atsU3XXwz9jTe0m7a2EyslazBS44NRJhXJyNE6OFukt3aC1Y2klFQK3xLlCJQvQP63qPPePUvWJcjKN%2BwN889g9F4Ztqu3Yw4%3D\">hp淘游记数码专营店</a></span>

    </div>

   </div>

   <div style=\"width: 1000px;\"></div>

   <div class=\"list\" style=\"margin-top: 0.5%;\"><li>神州系列</li></div>

   <div class=\"series\" style=\"margin-top: 0.5%;\">

    <div><a href=\"https://click.simba.taobao.com/cc_im?spm=a230r.1.14.1&p=%D3%CE%CF%B7%B1%BE&s=1749421245&k=621&e=ljeMH1ETQUR4GFUAFojh3KT52%2B0VcGqfFSRHJZHZe5E%2BCzw7QY4EhhmzS6kWLzMVgskEZVlows11o29%2Bz5ikCA%2FNs%2FuA%2FRWz2eJeOAhgZTER3%2Fm3F2e36ILu2AmR%2Bj00RZFXIYMDspVB9HDuvgwa6GYUkrjXsHKuZnRyCb04msRRGkMs%2BnlnJ68irifcupDG11%2Ft7Ew9mQc5AkbAx9PeY04Pzfl2rApXV4Rrocn%2FavDESq4t5Z1zQ4CjYnZjMLwbiXPZyqwWD%2F5KO9oofbtHjfj8HB%2B%2FpG%2FTgr7WBpu9ZIA08LAZPak1IqiiZE78WZsSEVRgIuDKRQeTNqxNmqJK63rIar%2BJsehXdRdPFq35HS6furlgdL50BICB0tbh%2FACNM06Tb6sS9M5EFlWEicAzDUeQTGTVM0oMwSJbmmoiZmrn96Mt51aH9rIpvuGxY2yfDtnMbsNymoCveEtfDCnHlsA6pt0d6BetluiK9%2B4CuA2KLE%2FgBNL%2BxD1qiXxwPXQwYtH9zpj4unDiryJgzQe50N4CxgWzhZzroP613xH9%2Fa4zKWcMsvWP0F1m4CQTlQ99cfm29BmFjHl5qwQtJP62LYxuXLO4E%2BmvUV6SMy5uyCk%3D\"><img src=\"img/HASEE1.jpg\" /></a></div>

    <div class=\"price\"><span>￥7199.00</span></div>   

    <div>

      <span class=\"baoyou\">包邮</span>&nbsp;

      <span><a class=\"name\" href=\"https://click.simba.taobao.com/cc_im?p=%D3%CE%CF%B7%B1%BE&s=1749421245&k=621&e=ljeMH1ETQUR4GFUAFojh3KT52%2B0VcGqfFSRHJZHZe5E%2BCzw7QY4EhhmzS6kWLzMVgskEZVlows11o29%2Bz5ikCA%2FNs%2FuA%2FRWz2eJeOAhgZTER3%2Fm3F2e36ILu2AmR%2Bj00RZFXIYMDspVB9HDuvgwa6GYUkrjXsHKuZnRyCb04msRRGkMs%2BnlnJ68irifcupDG11%2Ft7Ew9mQc5AkbAx9PeY04Pzfl2rApXV4Rrocn%2FavDESq4t5Z1zQ4CjYnZjMLwbiXPZyqwWD%2F5KO9oofbtHjfj8HB%2B%2FpG%2FTgr7WBpu9ZIA08LAZPak1IqiiZE78WZsSEVRgIuDKRQeTNqxNmqJK63rIar%2BJsehXdRdPFq35HS6furlgdL50BICB0tbh%2FACNM06Tb6sS9M5EFlWEicAzDUeQTGTVM0oMwSJbmmoiZmrn96Mt51aH9rIpvuGxY2yfDtnMbsNymoCveEtfDCnHlsA6pt0d6BetluiK9%2B4CuA2KLE%2FgBNL%2BxD1qiXxwPXQwYtH9zpj4unDiryJgzQe50N4CxgWzhZzroP613xH9%2Fa4zKWcMsvWP0F1m4CQTlQ99cfm29BmFjHl5qwQtJP62LYxuXLO4E%2BmvUV6SMy5uyCk%3D\" target=\"_blank\">神舟(HASEE)战神&nbsp;Z7-KP7GC&nbsp;八代I7&nbsp;吃鸡GTX1060&nbsp;6G独显</a></span>

    </div>

    <div style=\"width: 180px;\">

     <span class=\"line\">

      <span class=\"l\"></span>

      <span class=\"l\"></span>

      <span class=\"l\"></span>

     </span>

     <span><a class=\"shopname\" href=\"https://click.simba.taobao.com/cc_im?p=%D3%CE%CF%B7%B1%BE&s=1749421245&k=577&e=BxonOM2TwZh4GFUAFojh3KT52%2B0VcGqfFSRHJZHZe5E%2BCzw7QY4EhhmzS6kWLzMVgskEZVlows3hBBBbr7nW4g%2FNs%2FuA%2FRWz2eJeOAhgZTER3%2Fm3F2e36ILu2AmR%2Bj00RZFXIYMDspVB9HDuvgwa6GYUkrjXsHKuZnRyCb04msRRGkMs%2BnlnJ68irifcupDG11%2Ft7Ew9mQc5AkbAx9PeY04Pzfl2rApXV4Rrocn%2FavDESq4t5Z1zQ4CjYnZjMLwbiXPZyqwWD%2F5KO9oofbtHjfj8HB%2B%2FpG%2FTgr7WBpu9ZIA08LAZPak1IqiiZE78WZsSEVRgIuDKRQeTNqxNmqJK63rIar%2BJsehXdRdPFq35HS6furlgdL50BICB0tbh%2FACNM06Tb6sS9M5EFlWEicAzDUeQTGTVM0oMwSJbmmoiZmrn96Mt51aH9hAozdZo2z95FRWOTk6cW3S0qIZxkulnSVKwbmMH6XvPkzasTZqiSuvDtlPFq31TvOlqoMcwyvZzlaJn9qm4IZCEOJNw%2FYzcR1iFE4CqX1YMMJZFdnBUezEytZNtwI8et6Gjy8jxxF2W\">苏宁易购官方旗舰店</a></span>

    </div>

   </div>

   <div class=\"blank\"></div>

   <div class=\"series\" style=\"margin-top: 0.5%;\">

    <div><a href=\"//detail.tmall.com/item.htm?spm=a230r.1.14.6.63ce1a96FEjhrL&id=544732969418&ad_id=&am_id=&cm_id=140105335569ed55e27b&pm_id=&abbucket=18\"><img src=\"img/HASEE2.jpg\" /></a></div>

    <div class=\"price\"><span>￥5199.00</span></div>   

    <div>

      <span class=\"baoyou\">包邮</span>&nbsp;

      <span><a class=\"name\" href=\"//detail.tmall.com/item.htm?spm=a230r.1.14.9.63ce1a96FEjhrL&id=544732969418&ad_id=&am_id=&cm_id=140105335569ed55e27b&pm_id=&abbucket=18\" target=\"_blank\">Hasee/神舟&nbsp;战神&nbsp;K670D-G4D/T/D5/E5&nbsp;八代</a></span>

    </div>

    <div style=\"width: 180px;\">

     <span class=\"line\">

      <span class=\"l\"></span>

      <span class=\"l\"></span>

      <span class=\"l\"></span>

     </span>

     <span><a class=\"shopname\" href=\"//store.taobao.com/shop/view_shop.htm?spm=a230r.1.14.10.63ce1a96FEjhrL&user_number_id=255921860\">神舟电脑旗舰店</a></span>

    </div>

   </div>

   <div class=\"blank\"></div>

   <div class=\"series\" style=\"margin-top: 0.5%;\">

    <div><a href=\"//item.taobao.com/item.htm?spm=a230r.1.14.48.63ce1a96FEjhrL&id=563087775159&ns=1&abbucket=18#detail\"><img src=\"img/HAZEE3.jpg\" /></a></div>

    <div class=\"price\"><span>￥4498.20</span></div>   

    <div>

      <span class=\"baoyou\">包邮</span>&nbsp;

      <span><a class=\"name\" href=\"//item.taobao.com/item.htm?spm=a230r.1.14.51.63ce1a96FEjhrL&id=563087775159&ns=1&abbucket=18#detail\" target=\"_blank\">Hasee/神舟&nbsp;战神&nbsp;T6Ti-X7/X5DE&nbsp;Z7M-KP7GC/S吃鸡</a></span>

    </div>

    <div style=\"width: 180px;\">

     <span class=\"line\">

      <span class=\"l\"></span>

      <span class=\"l\"></span>

      <span class=\"l\"></span>

     </span>

     <span><a class=\"shopname\" href=\"//store.taobao.com/shop/view_shop.htm?spm=a230r.1.14.52.63ce1a96FEjhrL&user_number_id=369985166\">beyond46470204</a></span>

    </div>

   </div>

   <div class=\"blank\"></div>

   <div class=\"series\" style=\"margin-top: 0.5%;\">

    <div><a href=\"//item.taobao.com/item.htm?spm=a230r.1.14.107.63ce1a96FEjhrL&id=530887852528&ns=1&abbucket=18#detail\"><img src=\"img/HAZEE4.jpg\" /></a></div>

    <div class=\"price\"><span>￥5699.00</span></div>   

    <div>

      <span class=\"baoyou\">包邮</span>&nbsp;

      <span><a class=\"name\" href=\"//item.taobao.com/item.htm?spm=a230r.1.14.110.63ce1a96FEjhrL&id=530887852528&ns=1&abbucket=18#detail\" target=\"_blank\">Hasee/神舟&nbsp;战神&nbsp;ZX8-KP7S1&nbsp;ZX6&nbsp;ZX7&nbsp;ZX8&nbsp;GX8</a></span>

    </div>

    <div style=\"width: 180px;\">

     <span class=\"line\">

      <span class=\"l\"></span>

      <span class=\"l\"></span>

      <span class=\"l\"></span>

     </span>

     <span><a class=\"shopname\" href=\"//store.taobao.com/shop/view_shop.htm?spm=a230r.1.14.111.63ce1a96FEjhrL&user_number_id=1612183987\">神船大副</a></span>

    </div>

   </div>

  </div>

  </form>

 </body>

</html>  

 

给TA打赏
共{{data.count}}人
人已打赏
随笔日记

如何自学编程？学习方法在这里！

2020-11-9 3:58:57

随笔日记

前端面试必备的css盒子模型

2020-11-9 3:58:59

0 条回复 A文章作者 M管理员
    暂无讨论，说说你的看法吧
❯

解锁会员权限

开通会员

解锁海量优质VIP资源

立刻开通
个人中心
购物车
优惠劵
今日签到
有新私信 私信列表
搜索

  • 扫码打开当前页

  • 官方微信客服

返回顶部