项目场景:
问题描述:
两个div为inline元素,中间就会有间隙问题出现。
<style>
#id1{
margin-left: 100px;
display: inline;
background-color: #ddd;
}
#id2{
display: inline;
width: 200px;
height: 300px;
background-color: blueviolet;
}
</style>
<div id="id">
<div id="id1">scope1</div>
<div id="id2">scope2</div>
</div>
解决方案:
1.如果两个块用float属性,父级元素就得清楚浮动,可以解决空隙
2.使用css-flex属性 给父级元素加上display:flex, 可以解决
如果不用以上方法,空隙还是存在可以用下面的代码书写方式,代码如下
<div id="id">
<div id="id1">scope1</div><div id="id2">scope2</div>
</div>
应该是标签之前的制表符 换行 或者空格显示出来,占位了