css三分列

CSS三分列布局指的是一种将页面分成三列的布局，其中，左侧和右侧固定宽度，中间自适应宽度。这种布局可以适用于许多场景，比如展示产品介绍、新闻页面等。
为了实现CSS三分列布局，我们需要先写出一些基础的HTML结构：

<div class="container">
  <div class="left"></div>
  <div class="middle"></div>
  <div class="right"></div>
</div> 

其中，`.container`是我们布局的最外层容器，`.left`、`.middle`和`.right`分别是三个列的容器。
接下来，我们需要利用CSS来实现三分列布局：

.container {
  display: flex;
}
<br>
.left,
.right {
  width: 200px; /* 左右两列固定宽度 */
}
<br>
.middle {
  flex: 1; /* 中间自适应宽度 */
} 

以上CSS代码中，我们先为`.container`容器设置`display: flex;`属性，使得三个列可以横向排列。然后，我们分别为左列和右列设置了宽度`width: 200px;`，同时为中间列设置了`flex: 1;`，使之可以自适应宽度。
至此，我们就成功地实现了CSS三分列布局。
需要注意的是，这种布局方式在移动端可能会不太友好，因为左列和右列的宽度固定，可能会导致屏幕空间不足而出现横向滚动条。因此，在移动端建议使用其他适合的布局方式。