巧用CSS Flexbox布局，实现Web两盒子轻松横排排列！

可以使用CSS的flexbox布局来实现两个盒子的横排排列。 HTML代码: ```html <div class="container"> <div class="box">盒子1</div> <div class="box">盒子2</div> </div> ``` CSS代码: ```css .container { display: flex; } .box { width: 200px; height: 100px; background-color: gray; margin-right: 10px; } ``` 在上述代码中，`.container`设置为`display: flex;`将其内部元素排列为一行。`.box`定义了盒子的样式，包括宽度、高度、颜色和右边距。通过设置`margin-right: 10px;`，可以在两个盒子之间添加适当的间距。 这样，两个盒子就会在横向排列了。 ######[AI写代码神器 | 366点数解答 | 2024-06-20 14:28:55]