如何摆脱div中图片周围的默认边距？
如何摆脱div中图片周围的默认边距？
提问于 2019-04-15 01:29:53
我正在建设几个网站，总是有同样的问题与css。
我在一个div容器中有两个图像。
例如，当我将一个文本放入div中时，div采用文本的高度，但是当我出于某种未知的原因放入一个图像时，div突然似乎有一个默认的高度。
如你所见，我已经在我的css中响应了图像的大小。我在div上使用了一种颜色，只是为了更清楚地了解发生了什么。
当我缩小我的浏览器屏幕时，div的高度保持不变(因此没有响应)，并且由于某种原因，图像被下推到div中。
- 我该如何解决这个问题呢?我希望div容器的高度能像里面的图像一样响应，并保持与图像相同的高度，同时缩小浏览器屏幕。
- 最后但并非最不重要的一点是...我不明白的是什么？
谢谢你帮我的忙。
我的代码
<!DOCTYPE html>
<html>
<head>
<title></title>
</head>
<body>
<div style="background-color:red;">
<img style="height:2vw; width:4vw;" src="image.jpg" alt="en">
<img style="height:2vw; width:4vw;" src="image.jpg" alt="en">
</div>
</body>
</html>回答 4
Stack Overflow用户
发布于 2019-04-15 02:01:48
如果您希望父div具有特定的大小，则应该在div上强制使用尺寸，并将其属性继承给它的子级...
div{
height: 50vh;
width: 50vw;
background: red;
}
div>img{
height: 100%;
width: 100%;
}<div>
<img src="image.jpg" alt="text">
</div>Stack Overflow用户
发布于 2019-04-15 02:04:07
请检查一下这个。我想这会对你有帮助的。codepen
div{background-color:red;width:200px;overflow:hidden;}
div img{height:auto; max-width:100%;display:block;} <div>
<img src="image" alt="text">
</div>Stack Overflow用户
发布于 2019-04-15 02:04:20
您应该尝试在<img>标签中添加display: block;。
我希望这能有所帮助。
如果你没有使用Bootstrap或者其他的css框架，也许你需要在你的项目中添加reset.css文件。重置示例：https://meyerweb.com/eric/tools/css/reset/
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/55678091
复制相关文章
相似问题