模仿实现主流网页

日期：2022-06-16 栏目：程序人生 浏览：次

码云链接：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>
   <div><img src="http://www.likecs.com/img/logo.png" /></div>
   <div>
    <div><select>
     <option>宝贝</option>
     <option>店铺</option>
    </select></div>
    <div><input type="text" /></div>
    <div><input type="submit" value="搜索"/> </div>
   </div>
  </div>
  <div></div>
  <div>
   <dl>
    <dt>您是不是想找：</dt>
    <dd>
     <span>笔记本电脑</span>
     <span>台式电脑</span>
     <span>电脑主机</span>
     <span>苹果电脑</span>
     <span>外星人</span>
     <span>戴尔</span>
     <span>手提电脑</span>
     <span>游戏本</span>
     <span>联想电脑</span>
     <span>台式机</span>
     <span>平板电脑</span>
     <span>一体机</span>
     <span>游戏电脑</span>
     <span>华硕</span>
    </dd>
   </dl>
  </div>
  <div>
   <div>综合排序</div>
   <div>销量</div>
   <div>信用</div>
   <div>价格</div>
   <div>
    <ul>
     <li><input placeholder="¥" type="text" /></li>
     <li>-</li>
     <li><input placeholder="¥" type="text"/></li>
    </ul>
   </div>
  </div>
  <div>
   <ul>
    <li><input type="checkbox" />包邮</li>
    <li><input type="checkbox" />赠送退货运费险</li>
    <li><input type="checkbox" />货到付款</li>
    <li><input type="checkbox" />公益宝贝</li>
    <li><input type="checkbox" />二手</li>
    <li><input type="checkbox" />天猫</li>
    <li><input type="checkbox" />正品保障</li>
   </ul>
  </div>
  <div>
   <div><li>惠普系列</li></div>
   <div>
     <div><a href="http://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="http://www.likecs.com/img/HP1.jpg"/></a></div>
     <div><span>￥8688.00</span></div>   
     <div>
       <span>包邮</span>&nbsp;
       <span><a href="http://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>
      <span>
       <span></span>
       <span></span>
       <span></span>
      </span>
      <span><a href="http://taoyoujism.tmall.com">淘游记数码专营店</a></span>
     </div>
   </div>
   <div></div>
   <div>
    <div><a href="http://detail.tmall.com/item.htm?spm=a230r.1.14.101.2e334149fqcnGA&id=582165251620&ns=1&abbucket=1&sku_properties=5919063:6536025"><img src="http://www.likecs.com/img/HP2.jpg" /></a></div>
    <div><span>￥7999.00</span></div>   
    <div>
     <span>包邮</span>&nbsp;
     <span><a href="http://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>
     <span>
      <span></span>
      <span></span>
      <span></span>
     </span>
     <span><a href="http://hpeks.tmall.com">hp惠普尔卡圣专卖店</a></span>
    </div>
   </div>
   <div></div>
   <div>
    <div><a href="https://item.taobao.com/item.htm?spm=a230r.1.14.52.435842c36Bk5Mq&id=554520039064&ns=1&abbucket=1#detail"><img src="http://www.likecs.com/img/HP3.jpg" /></a></div>
    <div><span>￥4399.00</span></div>
    <div>
     <span>包邮</span>&nbsp;
     <span><a 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>
     <span>
      <span></span>
      <span></span>
      <span></span>
     </span>
     <span><a href="http://nb898.taobao.com">guoms20081</a></span>
    </div>
   </div>
   <div></div>
   <div>
    <div><a href="http://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="http://www.likecs.com/img/HP4.jpg" /></a></div>
    <div><span>￥5699.00</span></div>   
    <div>
     <span>包邮</span>&nbsp;
     <span><a href="http://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>
     <span>
      <span></span>
      <span></span>
      <span></span>
     </span>
     <span><a href="http://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></div>
   <div><li>神州系列</li></div>
   <div>
    <div><a href="http://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="http://www.likecs.com/img/HASEE1.jpg" /></a></div>
    <div><span>￥7199.00</span></div>   
    <div>
      <span>包邮</span>&nbsp;
      <span><a href="http://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>
     <span>
      <span></span>
      <span></span>
      <span></span>
     </span>
     <span><a href="http://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></div>
   <div>
    <div><a href="http://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="http://www.likecs.com/img/HASEE2.jpg" /></a></div>
    <div><span>￥5199.00</span></div>   
    <div>
      <span>包邮</span>&nbsp;
      <span><a href="http://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>
     <span>
      <span></span>
      <span></span>
      <span></span>
     </span>
     <span><a href="http://store.taobao.com/shop/view_shop.htm?spm=a230r.1.14.10.63ce1a96FEjhrL&user_number_id=255921860">神舟电脑旗舰店</a></span>
    </div>
   </div>
   <div></div>
   <div>
    <div><a href="//item.taobao.com/item.htm?spm=a230r.1.14.48.63ce1a96FEjhrL&id=563087775159&ns=1&abbucket=18#detail"><img src="http://www.likecs.com/img/HAZEE3.jpg" /></a></div>
    <div><span>￥4498.20</span></div>   
    <div>
      <span>包邮</span>&nbsp;
      <span><a 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>
     <span>
      <span></span>
      <span></span>
      <span></span>
     </span>
     <span><a href="http://store.taobao.com/shop/view_shop.htm?spm=a230r.1.14.52.63ce1a96FEjhrL&user_number_id=369985166">beyond46470204</a></span>
    </div>
   </div>
   <div></div>
   <div>
    <div><a href="//item.taobao.com/item.htm?spm=a230r.1.14.107.63ce1a96FEjhrL&id=530887852528&ns=1&abbucket=18#detail"><img src="http://www.likecs.com/img/HAZEE4.jpg" /></a></div>
    <div><span>￥5699.00</span></div>   
    <div>
      <span>包邮</span>&nbsp;
      <span><a 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>
     <span>
      <span></span>
      <span></span>
      <span></span>
     </span>
     <span><a href="http://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>

上一篇：数据可视化控件——大事记控件
下一篇：没有了

内容版权声明：除非注明，否则皆为本站原创文章。

转载注明出处：https://www.heiqu.com/zzxpgd.html

相关推荐