[分享]css两个div左右排列

在网页设计中，许多时候我们需要实现两个不同内容的div并排显示，比如左边显示文章正文，右边显示评论列表。这时候我们就需要使用CSS设置div的排列方式。下面是一个基本的CSS布局示例，让两个div实现...

在网页设计中，许多时候我们需要实现两个不同内容的div并排显示，比如左边显示文章正文，右边显示评论列表。这时候我们就需要使用CSS设置div的排列方式。下面是一个基本的CSS布局示例，让两个div实现左右排列：

 #left {
    width: 50%;
    float: left;
  }
  #right {
    width: 50%;
    float: right;
  } 

上面的CSS代码中，我们使用了float属性设置左右两个div元素。左边的div元素采用了左浮动（float: left）的方式，并且宽度设置为50%。右边的div元素采用了右浮动（float: right）的方式，同样宽度设置为50%。div元素默认是块级元素，float属性能够让它们“脱离文档流”，并填充它们所在的父元素。

这个CSS布局示例非常简单，但对于实现网页布局来说非常实用，特别是在响应式设计时。我们可以根据实际需要更改div的宽度和布局，以满足不同的设计需求。希望这个示例能对大家有所帮助！