代码拉取完成,页面将自动刷新
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>每日特价</title>
<style>
.arrow{
width:32px ;
height: 32px;
background-image: url(img/arrow.png);
position: fixed;
top: 90%;
right: 20px;
z-index: 11;
}
*{
margin: 0px;
padding: 0px;
list-style-type: none;
text-decoration: none;
color: #000000;
}
.heard{
width: 100%;
height: 200px;
}
.heard-top{
width: 100%;
height: 50px;
background-color: #000000;
}
.heard-top div{
width: 1200px;
height: 50px;
margin: auto;
/*border: 1px solid white;*/
}
.heard-top div img{
width: 200px;
height: 50px;
float: left;
}
.heard-top div ul li a{
width: 100px;
height: 50px;
float: right;
color: #FFFFFF;
line-height: 50px;
text-align: center;
}
.heard-top div ul li:hover a{
color: #FE9126;
transition: all 1s;
}
/*顶部黑色导航栏*/
.heard-cen{
width: 100%;
height: 100px;
background-color: white;
}
.heard-cen div{
width: 1200px;
height:100px;
/*border: 1px solid;*/
position: relative;
margin: auto;
}
.heard-cen div h1{
margin: auto;
width: 500px;
height: 100px;
font-size: 50px;
line-height: 100px;
color: #FE9126;
}
.heard-cen div input{
width: 250px;
height: 40px;
font-size: 30px;
position:absolute;
top: 30px;
right: 70px;
}
.heard-cen div span{
width: 40px;
height: 40px;
float: right;
position: absolute;
top: 30px;
right:20px;
border: 1px solid;
background-position-x: -12px;
background-position-y: 53px;
background-image:url(img/sousuo.png) ;
}
.heard-cen div span:hover{
background-image: url(img/sss.png);
}
/*中间白色导航带搜索框*/
.heard-bot{
width: 100%;
height: 50px;
background-color: #FE9126;
}
.h-b-d{
width: 1200px;
height:50px;
margin: auto;
/*border: 1px solid;*/
position: relative;
}
.index{
width: 200px;
height: 50px;
float: left;
line-height: 50px;
text-align: center;
/*border: 1px solid;*/
}
.one{
width:200px;
height: 50px;
line-height: 50px;
text-align: center;
float: left;
cursor: pointer;
/*border: 1px solid;*/
}
.two{
display: none;
width: 200px;
height: 250px;
background-color: white;
z-index: 4;
position: relative;
box-shadow: 0px 0px 5px;
/*border: 1px solid;*/
}
.two ol li a{
width: 200px;
height: 60px;
line-height: 60px;
text-align: center;
display: block;
color: #999999;
}
.two ol li:hover a{
color: #FE9126;
box-shadow: 0px 0px 5px;
}
.one:hover .two{
display: block;
}
/*导航栏结束可以复制*/
.bottom{
width: 100%;
height: 1550px;
position: relative;
}
.bottom h1{
width: 1200px;
height: 200px;
line-height: 200px;
text-align: center;
font-size: 70px;
margin: auto;
}
.bottom hr{
width:13%;
height: 3px;
font-size:200px;
display: block;
margin: auto;
background-color: red;
position: absolute;
top: 160px;
left:43%;
}
.bot{
width: 1200px;
height: 1340px;
border: 1px solid gainsboro;
margin: auto;
}
.mrtj{
width: 260px;
height: 400px;
text-align: center;
margin: 19px;
border:1px solid;
float: left;
}
.gm{
width: 170px;
height: 40px;
border-radius:20px;
border: 1px solid gainsboro;
margin: auto;
line-height: 40px;
background-color: skyblue;
}
.tp{
width: 260px;
height: 260px;
overflow: hidden;
}
.tp img{
width: 100%;
height: 100%;
}
.mrtj span{
line-height: 50px;
}
.xj{
color: red;
font-size: 30px;
}
.mrtj:hover .gm{
background-color:#FE9126 ;
transition:all .7s;
}
.mrtj:hover img{
transform: scale(1.2);
transition: all 1s;
}/*图文混排接结束*/
.bottom-b{
width: 100%;
height: 300px;
text-align: center;
background-color: #2B2A2A;
}
.bottom-b img{
width: 400px;
height:90px;
margin-top: 100px;
}
.bottom-b a{
width: 100%;
min-height: 50px;
line-height: 50px;
text-align: center;
color: white;
display: block;
}
</style>
</head>
<!--
作者:王风宝
时间:2019-11-22
描述:二级页面,今日推荐
-->
<body>
<div class="heard"><!--顶部导航-->
<a href="#DINGBU" class="arrow"></a>
<div class="heard-top">
<div>
<img src="img/logo.png" /><a name="DINGBU">
<ul>
<li><a href="购物车(2).html">购物车</a></li>
<li><a href="登录(2).html">登录</a></li>
<li><a href="注册(2).html">注册</a></li>
<li><a href="关于(2).html">关于</a></li>
</ul></a>
</div>
</div><!--顶部黑色-->
<div class="heard-cen">
<div>
<h1>SUPER MARKET</h1>
<input type="text" />
<span></span>
</div>
</div>
<div class="heard-bot">
<div class="h-b-d">
<ul>
<li class="index"><a href="index.html">首页</a></li>
<li class="one">
<p>水果</p>
<div class="two">
<ol>
<li><a href="水果(2).html">春季水果</a></li>
<li><a href="水果(2).html">夏季水果</a></li>
<li><a href="水果(2).html">冬季水果</a></li>
<li><a href="水果(2).html">秋季水果</a></li>
</ol>
</div>
</li>
<li class="one">
<p>蔬菜</p>
<div class="two">
<ol>
<li><a href="蔬菜.html">青菜</a></li>
<li><a href="蔬菜.html">干菜</a></li>
<li><a href="蔬菜.html">肉类</a></li>
<li><a href="蔬菜.html">海鲜</a></li>
</ol>
</div>
</li>
<li class="one">
<p>零食</p>
<div class="two">
<ol>
<li><a href="零食(2).html">坚果</a></li>
<li><a href="零食(2).html">辣条</a></li>
<li><a href="零食(2).html">饼干</a></li>
<li><a href="零食(2).html">干果</a></li>
</ol>
</div>
</li>
<li class="one">
<p>生活用品</p>
<div class="two">
<ol>
<li><a href="生活用品(2).html">餐具</a></li>
<li><a href="生活用品(2).html">家具</a></li>
<li><a href="生活用品(2).html">卫浴</a></li>
<li><a href="生活用品(2).html">服饰</a></li>
</ol>
</div>
</li>
<li class="one">
<a href="每日推荐2.html">每日特价</a>
</li>
</ul>
</div>
</div>
</div>
<!--顶部导航结束-->
<div class="bottom">
<h1>每日特价</h1>
<hr/>
<div class="bot">
<div class="mrtj">
<div class="tp">
<img src="img/fruit/草莓.JPG"/>
</div>
<h4>草莓</h4>
<span>¥20⇒</span><span class="xj">¥15</span>
<div class="gm">
<a href="草莓3.html">GOUMAI</a>
</div>
</div>
<div class="mrtj">
<div class="tp">
<img src="img/蔬菜/紫薯.JPG"/>
</div>
<h4>紫薯</h4>
<span>¥2⇒</span><span class="xj">¥1.5</span>
<div class="gm">
<a href="紫薯3.html">GOUMAI</a>
</div>
</div>
<div class="mrtj">
<div class="tp">
<img src="img/生活用品/鞋柜.JPG" />
</div>
<h4>鞋柜</h4>
<span>¥200⇒</span><span class="xj">¥150</span>
<div class="gm">
<a href="鞋柜3.html">GOUMAI</a>
</div>
</div>
<div class="mrtj">
<div class="tp">
<img src="img/fruit/苹果.JPG"/>
</div>
<h4>苹果</h4>
<span>¥2.0⇒</span><span class="xj">¥1.5</span>
<div class="gm">
<a href="苹果3.html">GOUMAI</a>
</div>
</div>
<div class="mrtj">
<div class="tp">
<img src="img/零食/夏威夷果.JPG" />
</div>
<h4>夏威夷果</h4>
<span>¥40⇒</span><span class="xj">¥35.5</span>
<div class="gm">
<a href="夏威夷果3.html">GOUMAI</a>
</div>
</div>
<div class="mrtj">
<div class="tp">
<img src="img/生活用品/垃圾桶.JPG" />
</div>
<h4>垃圾桶</h4>
<span>¥50⇒</span><span class="xj">¥25</span>
<div class="gm">
<a href="垃圾桶3.html">GOUMAI</a>
</div>
</div>
<div class="mrtj">
<div class="tp">
<img src="img/蔬菜/黄瓜.JPG" />
</div>
<h4>黄瓜</h4>
<span>¥0.9⇒</span><span class="xj">¥0.5</span>
<div class="gm">
<a href="黄瓜3.html">GOUMAI</a>
</div>
</div>
<div class="mrtj">
<div class="tp">
<img src="img/零食/开心果.JPG"/>
</div>
<h4>开心果</h4>
<span>¥50⇒</span><span class="xj">¥35</span>
<div class="gm">
<a href="开心果3.html">GOUMAI</a>
</div>
</div>
<div class="mrtj">
<div class="tp">
<img src="img/fruit/山竹.JPG" />
</div>
<h4>百香果</h4>
<span>¥10⇒</span><span class="xj">¥5</span>
<div class="gm">
<a href="山竹3.html">GOUMAI</a>
</div>
</div>
<div class="mrtj">
<div class="tp">
<img src="img/fruit/菠萝蜜.JPG" />
</div>
<h4>菠萝蜜</h4>
<span>¥20⇒</span><span class="xj">¥15.9</span>
<div class="gm">
<a href="波罗蜜3.html">GOUMAI</a>
</div>
</div>
<div class="mrtj">
<div class="tp">
<img src="img/生活用品/书柜.JPG" />
</div>
<h4>书柜</h4>
<span>¥300⇒</span><span class="xj">¥195</span>
<div class="gm">
<a href="书柜3.html">GOUMAI</a>
</div>
</div>
<div class="mrtj">
<div class="tp">
<img src="img/蔬菜/番茄.JPG" />
</div>
<h4>番茄</h4>
<span>¥0.5⇒</span><span class="xj">¥0.3</span>
<div class="gm">
<a href="番茄3.html">GOUMAI</a>
</div>
</div>
</div>
</div><!--每日特价报价-->
<div class="bottom-b">
<img src="img/logo2.png" />
<a href="#DINGBU">返回顶部</a>
</div>
</body>
</html>
此处可能存在不合适展示的内容,页面不予展示。您可通过相关编辑功能自查并修改。
如您确认内容无涉及 不当用语 / 纯广告导流 / 暴力 / 低俗色情 / 侵权 / 盗版 / 虚假 / 无价值内容或违法国家有关法律法规的内容,可点击提交进行申诉,我们将尽快为您处理。