- 1深入探索当下热门的开源AI大模型_处理图片最好的开源ai大模型
- 2锐捷交换机模拟环境搭建教程_锐捷模拟器
- 3Android Studio或IntelliJ IDEA使用经验_project iqiyi is using the following jdk location
- 4顺丰面试题（2018 顶级互联网公司面试题系列）
- 5《面试》游戏开发常用面试问题以及答案_unity lua与c#或c语言相互调用的底层实现原理是什么
- 6机器人工程师学习计划_凸优化大几学
- 7centos7中安装sql server_sendos7能装sqlserver吗
- 8windows电脑远程连接ubuntu20.04服务器,解决黑屏等一系列问题_ubuntu20.04远程桌面黑屏
- 9Hadoop应用案例分析_hadoop 案例
- 10Kinect系列1：(Windows环境配置)Python3+Pykinect2+KinectV2相机读取彩色图与深度图_kinect python
模仿淘宝htmlcss源码_仿淘宝商城源码html
赞
踩
<div>首页</div> </a> </li> <li> <a> <i class="searchbar-menu2 "></i> <div>百货</div> </a> </li> <li> <a> <i class="searchbar-menu3 "></i> <div>手机</div> </a> </li> <li> <a> <i class="searchbar-menu4 "></i> <div>男装</div> </a> </li> <li> <a> <i class="searchbar-menu5 "></i> <div>零食</div> </a> </li> <li> <a> <i class="searchbar-menu6 "></i> <div>生鲜</div> </a> </li> <li> <a> <i class="searchbar-menu7 "></i> <div>数码</div> </a> </li> <li> <a> <i class="searchbar-menu8 "></i> <div>更多</div> </a> </li> </ul> <div class="container"> <div class="quick-nav"> <div class="row"> <a href="https://www.tmall.com/"> <img src="imgs/icon/button1s.png"/> <div>天猫</div> </a> <a href="vue.html"> <img src="imgs/icon/button2s.png"/> <div>聚划算</div> </a> <a href="#"> <img src="imgs/icon/button3.png"/> <div>淘金币</div> </a> <a href="#"> <img src="imgs/icon/button4.png"/> <div>饿了么</div> </a> <a href="#"> <img src="imgs/icon/button5s.png"/> <div>充值中心</div> </a> </div> <div class="row"> <a href="#"> <img src="imgs/icon/button6.png"/> <div>签到</div> </a> <a href="#"> <img src="imgs/icon/button7s.png"/> <div>VIP</div> </a> <a href="#"> <img src="imgs/icon/button8s.png"/> <div>旅行</div> </a> <a href="#"> <img src="imgs/icon/button9s.png"/> <div>口碑</div> </a> <a href="#"> <img src="imgs/icon/button10.png"/> <div>客服</div> </a> </div> </div> <div class="banner-first"> <div class="left"> <div class="title">好货推荐</div> <div class="desc">限量秒杀</div> <div class="btn-buy">立即抢购 ></div> </div> <img class="right" src="imgs/icon/haixin1.jpg" class="right" /> </div> <div class="banner-scroll"> <img id="img" class="item" src="imgs/icon/lunbo1.jpg"/> <div class="tips">直通车</div> </div> </div> <div class="shops"> <div class="title-bar"> <span>推荐商品</span> </div> <div class="filter-bar"> <div class="item"> <span>综合排序</span> <img class="icon icon-arrow-down" src="imgs/icon/icon_arrow_down_gray.svg" /> </div> <div class="item">销量排序</div> <div class="item">好评最多</div> <div class="item"> <span>筛选</span> <img class="icon icon-filter" src="imgs/icon/icon_filter.svg" /> </div> </div> <div class="shop-list-container"> <div class="not-found-result"> <img class="img-not-found" src="./imgs/icon/weizhaodao.png"/> <div class="title">没有结果</div> <div class="desc">登录后查看更多商家</div> <div class="btn-login">登录</div> </div> </div> </div> <div class="btn-top"> <img class="icon icon-top" src="./imgs/icon/top.svg"/> </div> </div> <div class="footer"> <ul class="tab-menu"> <li class="active"> <a> <i class="icon icon-home"></i> <div>首页</div> </a> </li> <li> <a> <i class="icon icon-found"></i> <div>微淘</div> </a> </li> <li> <a> <i class="icon icon-order"></i> <div>消息</div> </a> </li> <li> <a> <i class="icon icon-buycar"></i> <div>购物车</div> </a> </li> <li> <a> <i class="icon icon-me"></i> <div>我的</div> </a> </li> </ul> </div>
- 1
- 2
- 3
- 4
- 5
- 6
- 7
- 8
- 9
- 10
- 11
- 12
- 13
- 14
- 15
- 16
- 17
- 18
- 19
- 20
- 21
- 22
- 23
- 24
- 25
- 26
- 27
- 28
- 29
- 30
- 31
- 32
- 33
- 34
- 35
- 36
- 37
- 38
- 39
- 40
- 41
- 42
- 43
- 44
- 45
- 46
- 47
- 48
- 49
- 50
- 51
- 52
- 53
- 54
- 55
- 56
- 57
- 58
- 59
- 60
- 61
- 62
- 63
- 64
- 65
- 66
- 67
- 68
- 69
- 70
- 71
- 72
- 73
- 74
- 75
- 76
- 77
- 78
- 79
- 80
- 81
- 82
- 83
- 84
- 85
- 86
- 87
- 88
- 89
- 90
- 91
- 92
- 93
- 94
- 95
- 96
- 97
- 98
- 99
- 100
- 101
- 102
- 103
- 104
- 105
- 106
- 107
- 108
- 109
- 110
- 111
- 112
- 113
- 114
- 115
- 116
- 117
- 118
- 119
- 120
- 121
- 122
- 123
- 124
- 125
- 126
- 127
- 128
- 129
- 130
- 131
- 132
- 133
- 134
- 135
- 136
- 137
- 138
- 139
- 140
- 141
- 142
- 143
- 144
- 145
- 146
- 147
- 148
- 149
- 150
- 151
- 152
- 153
- 154
- 155
- 156
- 157
- 158
- 159
- 160
- 161
- 162
- 163
- 164
- 165
- 166
- 167
- 168
- 169
- 170
- 171
</body>
- 1
CSS
- 1
- 2
- 3
- 4
- 5
body{
margin: 0;
}
.footer{
border-top:solid 1px rgb(236, 236, 236);
height: 62px;
background-color: white;
position: fixed;
bottom: 0;
left:0;
right:0;
}
.footer .tab-menu{
margin: 0;
padding:0;
list-style: none;
display: flex;
justify-content:space-around;
}
.footer .tab-menu li{
flex:1;
}
.footer .tab-menu li a{
text-align: center;
display: block;
padding:10px 0;
color:#8e8e93;
font-size: 14px;
}
.footer .tab-menu li a .icon{
width:23px;
height:23px;
display: block;
margin: 0 auto 2px auto;
background-size: contain;
}
.footer .tab-menu li a .icon.icon-home{
background-image: url(“./imgs/icon/tab_item_home.svg”);
}
.footer .tab-menu li a .icon.icon-found{
background-image: url(“./imgs/icon/tab_item_found.svg”);
}
.footer .tab-menu li a .icon.icon-order{
background-image: url(“./imgs/icon/tab_item_order.svg”);
}
.footer .tab-menu li a .icon.icon-me{
background-image: url(“./imgs/icon/tab_item_me.svg”);
}
.footer .tab-menu li a .icon.icon-buycar{
background-image: url(“imgs/icon/buycars.png”);
}
.footer .tab-menu li.active a{
color:#0085ff;
}
.footer .tab-menu li.active a .icon.icon-home{
background-image: url(“imgs/icon/taobaofoot.png”);
}
.footer .tab-menu li.active a .icon.icon-found{
background-image: url(“./imgs/icon/tab_item_found_active.svg”);
}
.footer .tab-menu li.active a .icon.icon-order{
background-image: url(“./imgs/icon/tab_item_order_active.svg”);
}
.footer .tab-menu li.active a .icon.icon-me{
background-image: url(“./imgs/icon/tab_item_me_active.svg”);
}
.main{
margin-bottom: 64px;
}
.main .btn-top{
position: fixed;
right: 10px;
bottom:84px;
width:52px;
height:52px;
background-color: white;
border-radius: 50%;
border:solid 1px #999;
display: flex;
justify-content: center;
align-items: center;
- 1
- 2
- 3
}
.main .btn-top .icon{
width:24px;
height:24px;
}
.main .btn-top .icon-top{
}
.search-bar-top{
height: 55px;
background-image: linear-gradient(90deg,#FF9900,#F7F709);
display: flex;
align-items: center;
padding:0 20px;
}
.search-bar-top .icon-location {
width: 16px;
height:20px;
vertical-align: middle;
}
.search-bar-top .place{
font-size: 23px;
color:white;
font-weight: bold;
vertical-align: middle;
margin:0 5px;
}
.search-bar-top .icon-arrow-down{
width:8px;
height:5px;
vertical-align: middle;
}
.search-bar-button{
height: 63px;
background-image: linear-gradient(90deg,#FF9900,#F7F709);
display: flex;
align-items: center;
}
.search-bar-button .btn-search{
flex:1;
height:44px;
margin:0 20px;
background-color:white;
border-radius: 2px;
display: flex;
align-items: center;
justify-content: center;
}
.search-bar-button .icon-search{
width:18px;
height:18px;
vertical-align: middle;
}
.search-bar-button .placeholder{
font-size:18px;
color:#999;
font-weight: 100;
vertical-align: middle;
margin-left: 5px;
}
.quick-nav{
padding-bottom: 34px;
}
.quick-nav .row{
display: flex;
justify-content: space-around;
padding:6px 0;
}
.quick-nav a{
display: block;
text-decoration: none;
color: #666;
font-size: 15px;
text-align: center;
}
.quick-nav a img{
height: 55px;
width: 55px;
}
.quick-nav a div{
}
算法刷题
大厂面试还是很注重算法题的，尤其是字节跳动，算法是问的比较多的，关于算法，推荐《LeetCode》和《算法的乐趣》，这两本我也有电子版，字节跳动、阿里、美团等大厂面试题（含答案+解析）、学习笔记、Xmind思维导图均可以分享给大家学习。
开源分享：【大厂前端面试题解析+核心总结学习笔记+真实项目实战+最新讲解视频】
写在最后
最后，对所以做Java的朋友提几点建议，也是我的个人心得：
-
疯狂编程
-
学习效果可视化
-
写博客
-
阅读优秀代码
-
心态调整
- 一、htmlHTML>
Home [详细] -->赞
踩
