<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>元素</title>
<style>
.box{
width: 212px;
height: 318px;
border: 1px solid salmon;
margin: 100px auto;
position:relative;
}
img {
width: 100%;
height: 100%;
}
.touming{
background-color: rgba(0, 0, 0, .4);
background-image: url(image/2.jpg);
width:100%;
background-repeat: no-repeat;
background-position: center;
background-size: 50px;
height:100%;
position:absolute;
display:none;
}
.box:hover .touming{
display:block;
}
.touming{
text-shadow: royalblue;
}
</style>
</head>
<body>
<div class="box">
<div class="touming"></div>
<a href=""><img src="https://img.uj5u.com/2020/11/06/153707060727521.jpg" ></a>
</div>
</body>
</html>
為什么這一行 <a href=""><img src="https://img.uj5u.com/2020/11/06/153707060727521.jpg" ></a>鏈接無法發揮作用？
uj5u.com熱心網友回復：
href都留空了，你想要什么作用uj5u.com熱心網友回復：
.box:hover .touming{display:block;
}這個樣式引起的
uj5u.com熱心網友回復：
為什么？不是很懂
轉載請註明出處，本文鏈接：https://www.uj5u.com/qianduan/204120.html
標籤：HTML(CSS)
下一篇：后端Model帶引數怎么實作