极客观点
项目管理
HarmonyOS
我想实现一个效果，一个div之内包含一个图片标签。div设置通过border-radius设置成一个圆形。想实现图片也占满圆形的效果。然后该div加一个box-shadow.但是实现的效果跟预期的不一致。
为什么图片没有占满整个div呢？div和图片之间还有一个空隙。
我的代码如下：
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<title>Document</title>
<style>
*{padding: 0;margin: 0;box-sizing: border-box}
div{
width: 130px;height: 130px;border: 1px solid #444;
border-radius: 50%;
margin: 100px auto;
box-shadow: 0 0 10px #444;
vertical-align: top;
}
img{
display: block;
width: 100%;height: 100%;
}
</style>
</head>
<body>
<div>
<img src="./img/default.png" alt="">
</div>
</body>
</html>
html5
你的代码没有一点问题，请仔细检查你的图片是不是四周有白色的边界。