为什么两个图像之间有余量?

时间:2018-04-10 15:20:14

标签: css margin

我删除了两张图片的边距,但它们之间有一个边距。这根本不会让我烦恼。我很有趣的是为什么保证金存在。这是我在stackoverflow上的第一篇文章。我无法发布图片。 CSS代码如下:

<html>
<head>
	<title>test</title>
	<meta charset="utf-8" />
	<style>
		img {
			width: 200px;
			background-color: red;
			border: 5px solid #333;
			padding: 20px;
			margin: 0;
		}
	</style>
</head>
<body>
	<p>
		<img src="timg1.jpg" id="photo1" />
		<img src="timg2.jpg" id="photo2" />
	</p>
</body>
</html>

1 个答案:

答案 0 :(得分:4)

因为内联元素对代码中的空格很敏感。只需删除它:

img {
  width: 200px;
  background-color: red;
  border: 5px solid #333;
  padding: 20px;
  margin: 0;
}
<p>
  <img src="timg1.jpg" id="photo1" /><img src="timg2.jpg" id="photo2" />
</p>