商城列表内容
程序员文章站
2022-03-01 20:33:45
...
<!DOCTYPE html><html lang="en"><head><meta charset="UTF-8"><title>商城列表</title><link rel="stylesheet" href="./css/base.css" /><link rel="stylesheet" href="./css/eduwork.css" /><link rel="stylesheet" href="./css/iconfont.css" /><link rel="stylesheet" href="./css/layout.css" /><link rel="stylesheet" href="./css/footer.css" /><link rel="stylesheet" href="./css/list.css" /><link rel="stylesheet" href="https://at.alicdn.com/t/font_2934967_enobaibly2.css"></head><body><!--头部标签--><header class=" container d-flex jusify-content-between"><div class=""><img src="./img/logo.png" alt=""></div><div class=" d-flex jusify-content-between align-items-center"><div class="px-3"><a href="" class="fontSize14">登录</a><span>|</span><a href="" class="fontSize14">注册</a></div><div class="pl-2 border-bottom border-black py-1"><form action=""><input type="search" class="border-0" placeholder="热门搜索:细说php" name="" id=""><button class="header-button iconfont border-0 bg-transparent textColorRed120 icon-sousuo"></button></form></div><div class="px-3 header-icon d-flex align-items-center"><i class="iconfont icon-31wode textColorRed120"></i><i class="iconfont icon-erweima textColorRed120"></i><i class="iconfont icon-gouwuchekong textColorRed120"></i></div></div></header><!--导航栏--><nav class="container-full "><ul class="d-flex w-40 m-auto text-center"><li class="py-2 px-4 mx-3"><a href="" class="fontSize14">首页</a></li><li class="py-2 px-4 mx-3"><a href="" class="fontSize14">编程图书</a><section class="w-100 position-absolute left-0"><ul class="d-flex w-40 m-auto"><li class="py-2 px-4 mx-3"><a href="" class="text-white">细说PHP</a></li><li class="py-2 px-4 mx-3"><a href=" " class="text-white">细说PHP</a></li><li class="py-2 px-4 mx-3"><a href="" class="text-white">细说PHP</a></li><li class="py-2 px-4 mx-3"><a href="" class="text-white">细说PHP</a></li></ul></section></li><li class="py-2 px-4 mx-3"><a href="" class="fontSize14">算法图书</a></li><li class="py-2 px-4 mx-3"><a href="" class="fontSize14">AI图书</a></li><li class="py-2 px-4 mx-3"><a href="" class="fontSize14">人工智能 </a></li></ul></nav><!--导航栏滚动图片--><section class="banner container-full overflow-hidden border border-box"><div class="d-flex w-300"><img src="../project/img/001.jpeg" alt="" class="w-100"><img src="../project/img/2.jpeg" class="w-100" alt=""><img src="../project/img/3.jpeg" class="w-100" alt=""></div></section><!--侧边栏--><aside class="posetion-fixed right-10 d-flex flex-column jusify-content-between"><div class="iconfont border p-3 bg-db cursor textColorRed120 icon-gouwuchekong"></div><div class="iconfont border p-3 bg-db cursor textColorRed120 mt-1 icon-sousuo"></div><div class="iconfont border p-3 bg-db cursor textColorRed120 mt-1 icon-31wode"></div><div class="iconfont border p-3 bg-db cursor textColorRed120 mt-1 icon-erweima"></div></aside><!--三级导航--><section class="container-full border-bottom"><section class="container py-1"><span><a href="" class="text-777 hover-a-none">首页</a></span><span class="mx-3">/</span><span><a href="" class="text-777 hover-a-none">编程书籍</a></span><span class="mx-3">/</span><span>细说系列</span></section></section><!--搜索--><section class="container-full border-bottom"><section class="container d-flex jusify-content-between align-items-center"><h2 class="fontSize18">细说系列</h2><div class=" bg-white order-list w-15 "><div class="d-flex border jusify-content-between align-items-center"><span>排序方式</span><i class="iconfont icon-xiajiantou"></i></div><div class="border ">新品上市</div><div class="border border-top-0 ">销量从高到低</div><div class="border border-top-0 ">销量从低到高</div><div class="border border-top-0 ">价格从高到低</div><div class="border border-top-0 ">价格从低到高</div></div></section></section><!--商品列表--><section class="container my-4 d-flex jusify-content-between"><section class="card border-0"><img src="./img/pro01.jpg" class="border-radius-5" alt=""><div class="card-body"><a href="" class="d-block hover-a-none">【细说】细说PHP</a><a href="" class="hover-a-none textColorRed120 fontSize14">￥159.00</a></div></section><section class="card border-0"><img src="./img/pro01.jpg" class="border-radius-5" alt=""><div class="card-body"><a href="" class="d-block hover-a-none">【细说】细说PHP</a><a href="" class="hover-a-none textColorRed120 fontSize14">￥159.00</a></div></section><section class="card border-0 "><img src="./img/pro01.jpg" class="border-radius-5" alt=""><div class="card-body"><a href="" class="d-block hover-a-none">【细说】细说PHP</a><a href="" class="hover-a-none textColorRed120 fontSize14">￥159.00</a></div></section><section class="card border-0 posetion-relative"><img src="./img/pro01.jpg" class="border-radius-5" alt="" ><div class="card-body"><a href="" class="d-block hover-a-none">【细说】细说PHP</a><a href="" class="hover-a-none textColorRed120 fontSize14">￥159.00</a></div></section></section><!--底部标签--><footer class="container-full border-top mt-4 "><section class="container d-flex my-2 jusify-content-around align-items-center"><div class="border-right py-1 flex-grow1 px-2 pr-4 d-flex jusify-content-center align-items-center"><img src="./img/foot1.png" alt=""><p class="pl-1 ml-2 pr-4">7天无理由退货</p></div><div class="border-right py-1 flex-grow1 px-2 pr-4 d-flex jusify-content-center align-items-center"><img src="./img/foot1.png" alt=""><p class="pl-1 ml-2 pr-4">7天无理由退货</p></div><div class="border-right py-1 flex-grow1 px-2 pr-4 d-flex jusify-content-center align-items-center"><img src="./img/foot1.png" alt=""><p class="pl-1 ml-2 pr-4">7天无理由退货</p></div><div class=" py-1 flex-grow1 px-2 pr-4 d-flex jusify-content-center align-items-center"><img src="./img/foot1.png" alt=""><p class="pl-1 ml-2 pr-4">7天无理由退货</p></div></section><section class="bg-black text-center py-3"><p class="text-white">最家家居©2013-2017公司版权所有 京ICP备080100-44备0000111000号<br/>违法和不良信息举报电话：400-800-8200，本网站所列数据，除特殊说明，所有数据均出自我司实验室测试</p></section></footer></body></html>
上一篇： laravel 视图view