Posted on | by liu
HTML网页中，大家可以通过CSS样式来控制元素的外观。在CSS中，大家可以使用如下属性控制元素的横向排列：
1. float
float属性将元素向左或向右浮动，使得其他元素可以占据空间。例如，大家可以使用如下代码将两个div元素分别向左和向右浮动：
.left{
float:left;
width:50%;
}
.right{
float:right;
width:50%;
}
这个代码块将两个50%宽度的div元素分别向左和向右浮动。注意，必须设置元素的宽度，否则元素将无法浮动。
2. display: inline-block
使用display: inline-block，可以使得元素像行内元素一样排列，但是又可以设置元素的宽度和高度等盒子模型属性。
.left{
display: inline-block;
width:50%;
}
.right{
display: inline-block;
width:50%;
}
这个代码块使用inline-block将两个50%宽度的div元素排列在同一行。但是注意，在两个元素之间留空格或者换行符，可能会导致元素之间产生间隔。
3. flexbox布局
flexbox布局是CSS3新引入的一种布局方式，主要用于处理容器中多个子元素的排列。大家可以使用flex布局来指定子元素的排列方式。
.container{
display: flex;
justify-content: space-between;
}
这个代码块使用了flex布局，将容器中的子元素按照space-between来排列。space-between表示子元素之间的间隔将会均分到容器中，使得子元素之间的间隔相等。其他的flex属性还有align-items、flex-grow等，可以根据需要进行设置。
总之，以上三种方法都可以帮助大家控制元素的横向排列。具体使用哪种方法，可以根据具体情况进行选择。