这里有一段简单的代码块:
<style type="text/css">
.parent {
position: relative;
width: 75vw;
height: 300px;
border: 5px solid #000;
}
.child {
width: 100%;
height: 100px;
background-color: #999;
}
</style>
<center>
<div class="parent">
<div class="child"></div>
</div>
</center>
但是,在不同的屏幕宽度下,结果是不同的。
在某个屏幕宽度下,子 div 完全适合父 div。
然而在另一个屏幕宽度下,子 div 两侧出现了约 1 像素的白边。
如何消除这些白边并确保子 div 完全适合父 div?
box-sizing
来解决它。 - learningtoanimate