.imgbox{
width: 1200px;
height: 612px;
margin-right: auto;
margin-left: auto;
margin-top: 60px;
}
.m1{
border: solid;
border-width: 1px;
height: 300px;
width: 227px;
}
#m1img{
text-align:center;
padding-top: 55px;
}
#img2{
margin-bottom: 35px;
}
p>span {
text-decoration:line-through;
}
#where1{
position: absolute;
left:412px;
top: 60px;
}
#where2{
position: absolute;
left:651px;
top: 60px;
}
#where3{
position: absolute;
left:890px;
top: 60px;
}
#where4{
position: absolute;
left:1129px;
top: 60px;
}
#where5{
position: absolute;
left:412px;
top: 372px;
}
#where6{
position: absolute;
left:651px;
top: 372px;
}
#where7{
position: absolute;
left:890px;
top: 372px;
}
#where8{
position: absolute;
left:1129px;
top: 372px;
}
#sbox{
height:76px;
width: 227px;
background-color: #ff6700;
opacity: 0;
z-index:999;
position: absolute;
bottom: -0.5px;
}
#where1:hover #sbox{
opacity: 1;
}
#where2:hover #sbox{
opacity: 1; (显示)
}
#where3:hover #sbox{
opacity: 1;
}
#where4:hover #sbox{
opacity: 1;
}
#where5:hover #sbox{
opacity: 1;
}
#where6:hover #sbox{
opacity: 1;
}
#where7:hover #sbox{
opacity: 1;
}
#where8:hover #sbox{
opacity: 1;
}
#sboxp{
line-height: 76px;
color: white;
}
HTML的代码
小米电视3
999元 1199元
小米电视促销
小米电视5
1099元 1399元
小米电视促销
小米电脑
4999元 5199元
小米电脑促销
小米电脑
5999元 6199元
小米电脑促销
小米电视3
999元 1199元
小米电视促销
小米电视5
1099元 1399元
小米电视促销
小米电脑
4999元 5199元
小米电脑促销
小米电脑
5999元 6199元
小米电脑促销
总结
到此这篇关于CSS盒子隐藏/显示后再最上层的实现代码的文章就介绍到这了,更多相关css 盒子隐藏内容请搜索考高分网以前的文章或继续浏览下面的相关文章，希望大家以后多多支持考高分网！
