内部の影と内部の画像で div をスケーリングしようとしています。コードは次のとおりです。
<!DOCTYPE html>
<html>
<head>
<title> Home Page </title>
<style>
div#b{
box-shadow:0 0 10px 2px #fff inset;
border-radius:10px;
width:230px;
height:150px;
transition: all 1s ease;
}
div#b:hover {
position:relative;
z-index:3;
transform:scale(1.2,1.2) rotate(0.02deg);
}
div#b img{
width:230px;
height:150px;
border-radius:10px;
position: relative;
z-index:-2;
}
</style>
</head>
<body>
<div id="b">
<a href="#">
<img src="img.jpg" alt="img" title="myimg">
</a>
</div>
</body>
</html>
問題は、マウスを div に合わせると、内側の影を隠している div に画像が表示されることです。
私はすでに div:hover を z-index:3 しようとしましたが、結果はありません。あなたは私を助けることができます?
前もって感謝します