css中水平分割div三栏

CSS中水平分割div为三个部分是网页设计中常用的技巧之一，可以通过CSS的样式属性来完成这一操作。

.container {
  width: 100%;
  height: 300px;
  display: flex;
}

.left-pane {
  width: 33.33%;
  background-color: #f2f2f2;
}

.center-pane {
  width: 33.33%;
  background-color: #d9d9d9;
}

.right-pane {
  width: 33.33%;
  background-color: #bfbfbf;
} 

首先，我们需要一个包含三个div的容器，使用flexbox布局可以使三个div水平分割并自适应宽度。

接着，我们为每个div添加一个宽度样式属性，这里我们将三个div的宽度都设置为33.33%。

最后，我们按照需求为每个div添加背景颜色样式属性，这里我们只是简单的为每个div添加一种不同的灰色，以便更好地区分三个div。

这样，我们就成功地将一个容器水平分割成了三个部分，可以根据需求进一步进行修改和定制。