除了flex,具体怎么把在父元素div下 里面横向排列两个div
时间: 2024-04-29 11:25:23 浏览: 115
div横向排列
5星 · 资源好评率100%
1. 使用display:inline-block属性
可以将两个子元素设置为display:inline-block,这样它们会水平排列在一起。
HTML代码:
```
<div>
<div class="child"></div>
<div class="child"></div>
</div>
```
CSS代码:
```
.child {
display: inline-block;
}
```
2. 使用float属性
也可以使用float属性将子元素浮动到左侧或右侧,从而实现横向排列。
HTML代码:
```
<div>
<div class="child"></div>
<div class="child"></div>
</div>
```
CSS代码:
```
.child {
float: left; /* 或 float:right */
}
```
需要注意的是,这种方法可能会导致父元素高度塌陷,需要额外处理。
阅读全文