lsy/practice_code
0
0
Fork 0
Code Pull Requests Actions Packages Projects Releases Wiki Activity

写好楼层顶部

Browse Source
This commit is contained in:
lsy2246 2024-05-15 15:26:17 +08:00
parent b5be1cec50
commit 0fa08bf074
2 changed files with 106 additions and 1 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

79
web/shang_shopping/css/index.css
View File

@ -230,6 +230,7 @@
height:458px;
width: 690px;
margin: 0 10px;
font-size: 0;
}
.main_content .slide-other{
@ -357,4 +358,80 @@
background-position: -144px -96px;
}
/* endregion 主要内容区结束 */
/* endregion 主要内容区结束 */
/* region 秒杀 */
.seckill{
margin-top: 10px;
font-size: 0;
}
.seckill a{
float: left;
}
.seckill a:not(:last-child){
margin-right: 11px;
}
/* endregion 秒杀结束 */
/* region 楼层 */
.floor .floor_nav{
margin-top:48px ;
height:34px;
border-bottom: 2px solid #DD302D;
}
.floor .floor_nav span{
line-height: 34px;
height: 34px;
font-size: 20px;
color: #000000;
font-weight: bold;
}
.floor .floor_nav dl dt{
float: left;
color: #DD302D;
height: 34px;
line-height: 34px;
}
.floor .floor_nav dl dt a:link,.floor .floor_nav dl dt a:visited{
color:red;
}
.floor .floor_nav dl dt a:hover{
color: white;
background-color: red;
}
.floor .floor_nav dl dd{
float: left;
height: 34px;
line-height: 34px;
margin-left:20px ;
}
.floor .floor_nav dl dd:before{
content: "|";
width: 1px;
position: relative;
right: 10px;
}
.floor .floor_nav dl dd a:link,.floor .floor_nav dl dd a:visited
{
font-size: 16px;
color: #666666;
}
.floor .floor_nav dl dd a:hover
{
color: red;
}
.floor .floor_info{
height:432px;
background-color: skyblue;
}
/* endregion 楼层结束 */

28
web/shang_shopping/index.html
View File

@ -361,6 +361,34 @@
</div>
</div>
</div>
<!--秒杀-->
<div class="seckill">
<div class="container float_clear">
<a href="#"><img src="./images/seckill.png" alt="秒杀"></a>
<a href="#"><img src="./images/banner1.png" alt="秒杀图片1"></a>
<a href="#"><img src="./images/banner2.png" alt="秒杀图片2"></a>
<a href="#"><img src="./images/banner3.png" alt="秒杀图片3"></a>
<a href="#"><img src="./images/baner4.png" alt="秒杀图片3"></a>
</div>
</div>
<!--楼层-->
<div class="floor">
<div class="container">
<div class="floor_nav float_clear">
<span class="float_left">家用电器</span>
<dl class="float_right float_clear">
<dt><a href="#">热门</a></dt>
<dd><a href="#">大家电</a></dd>
<dd><a href="#">生活电器</a></dd>
<dd><a href="#">厨房家电</a></dd>
<dd><a href="#">应季家电</a></dd>
<dd><a href="#">空气/净水</a></dd>
<dd><a href="#">高端家电</a></dd>
</dl>
</div>
<div class="floor_info"></div>
</div>
</div>
</body>
</html>