如何让多个div横向排列（html+css）

div是块级元素，是自上而下、垂直排列会占满一行且具有自动换行功能。

方法一：使用flex自适应

<div class="all"><div class="a"></div><div class="b"></div><div class="c"></div></div>

.all{display: flex; /*给父元素设置flex*/}.a,.b,.c{width: 300px;height: 100px; }.a{background-color: black;}.b{background-color: background-color:pink;}.c{background-color: red;}

方法二：使用float浮动方式

<div class="a"></div><div class="b"></div><div class="c"></div>

.a,.b,.c{width: 300px;height: 100px; float: left;/*使三个div向左浮动*/}.a{background-color: black;}.b{background-color:pink;}.c{background-color: red;}