1. 什么是Margin
在CSS中，Margin是指边框外侧和父元素（或相邻元素）之间的空间。
例如，下面的代码创建了一个包含文本的div元素，并给它定义了一个15像素的Margin：
div {
margin: 15px;
}
这将在div元素周围创建一个15像素的空白区域，使它与父元素之间保留一些距离。
2. 如何清除Margin
通常来说，浏览器会给各个HTML元素自动应用一些默认的Margin值。这些默认的Margin值可能会破坏您的布局，甚至可能使您的网页看起来不可接受。因此，有时候需要清除这些Margin。
下面介绍几种清除Margin的方法：
2.1 使用CSS Reset
CSS Reset是一种在您的网页中应用通用样式的方法，它将为您的所有HTML元素提供相关的CSS属性值。它的目的是消除浏览器间存在的差异，让所有HTML元素的外观在各个浏览器中的表现尽量一致。
样式表的内容通常如下所示：
* {
margin: 0;
padding: 0;
box-sizing: border-box;
}
html,body{
height: 100%;
}
上面代码中的第一个部分，将所有元素的Margin和Padding设置为0，将盒模型设置为使用border-box。这样，您就能够完全控制元素的内部宽度，不会受到设置Padding时元素宽度被放大的问题。
在第二个部分，将html和body元素的高度均设置为100%。这样，您就可以确保HTML和BODY两个元素的高度均为视口高度的百分之百，从而在使用100%高度的元素时，不会出现不正确的计算偏差。
需要注意的是，CSS Reset破坏的样式可能需要手动重新编写。同时，当您的网页需要向后兼容时，应慎重考虑使用CSS Reset。
2.2 使用Normalize.css
Normalize.css是一个开源的CSS样式库，用于在所有Web浏览器上通过预设样式来进行跨浏览器一致的CSS重置。与CSS Reset不同，Normalize.css是一组基本样式，有助于让您的样式在各个浏览器中表现一致。
通过使用Normalize.css，您可以消除浏览器之间的差异，同时维护默认HTML样式的良好功能。这意味着您可以选择保留大多数HTML元素的默认预设样式，同时通过Normalize.css使这些样式具有更好的一致性和一致性。
2.3 使用负Margin
负Margin是一种强大的CSS技术，可用于消除元素周围的Margin值，而不用修改HTML结构或使用CSS重置/Normalize.css。它允许您将Margin的负值应用于元素，从而将元素向外移动，而不是向内移动。这将导致元素的边框与父元素之间没有外边距。
看下面的例子：
.parent {
background-color: #f1f1f1;
border: 1px solid #ddd;
padding: 20px;
}
.child {
background-color: #fff;
border: 1px solid #999;
padding: 20px;
margin: 20px;
}
.child2 {
background-color: #fff;
border: 1px solid #999;
padding: 20px;
margin-top: -20px;
margin-bottom: -20px;
}
上面的代码创建了两个元素：parent和child。它们都有一个Margin以及边框和内边距。如果您不想让child元素有Margin，只需在CSS中为该元素添加负Margin。例如，child2元素的Margin设置为 -20px，如下所示：
.child2 {
background-color: #fff;
border: 1px solid #999;
padding: 20px;
margin-top: -20px;
margin-bottom: -20px;
}
这会使child2元素边框与其父元素之间的Margin消失，从而使布局更加紧凑。
2.4 使用flex布局
CSS3中新增的flexbox布局模式提供了一种粗暴的清除Margin的方式。使用flexbox布局时，可以将子元素的Margin收缩，让布局更加紧凑。
下面是一个简单的示例，说明如何使用flexbox布局来清除Margin：
.container {
display: flex;
flex-wrap: wrap;
}
.container div {
flex-grow: 1;
margin: 10px;
background-color: #f1f1f1;
}
上面的代码创建了一个含有多个子元素的卡片板式布局。使用flexbox布局后，每个子元素的Margin值将收缩，并且布局看起来更加紧凑。这将在各种设备上达到最佳响应式效果。
2.5 使用float属性
使用CSS中的float属性也可用于清除Margin。下面的例子说明了如何使用float属性。
.container {
width: 640px;
margin: 0 auto;
}
.container div {
float: left;
margin: 0 20px 20px 0;
width: 150px;
background-color: #f1f1f1;
}
该代码创建了一个容器，其中的多个子元素使用float属性靠左对齐。这将消除子元素之间的Margin，并使布局变得更紧凑。
3. 总结
在CSS中，Margin是指边框外侧和父元素（或相邻元素）之间的空间。如果您的网页显示不正确，可能需要清除Margin。为此，您可以使用CSS Reset或Normalize.css，也可以使用flexbox布局或float属性。此外，还可以使用负Margin向外移动元素，以消除其Margin。
在实际开发中，您应该根据具体情况选择最适合的方法。同时，需要谨慎使用各种清除Margin的技术，以确保不会破坏布局或导致其他问题出现。