css三列表排序

CSS三列排序可以通过使用float属性和width属性来实现。下面是一些示例代码：

.col-1 {
  float: left;
  width: 33.33%;
}

.col-2 {
  float: left;
  width: 33.33%;
}

.col-3 {
  float: left;
  width: 33.33%;
} 

上面的代码演示了如何使用CSS来创建三列布局，每列的宽度为33.33%。接下来，我们需要为这些列设定一些样式来给它们不同的颜色和背景：

.col-1 {
  float: left;
  width: 33.33%;
  background-color: yellow;
}

.col-2 {
  float: left;
  width: 33.33%;
  background-color: cyan;
}

.col-3 {
  float: left;
  width: 33.33%;
  background-color: magenta;
} 

上面的代码将第一列的背景颜色设为黄色，第二列的背景颜色设为青色，第三列的背景颜色设为品红色。如果要添加样式以区分列之间的间隔，可以在列之间添加一些间距和边框：

.col-1 {
  float: left;
  width: 33.33%;
  background-color: yellow;
  border-right: 1px solid black;
  margin-right: 5px;
}

.col-2 {
  float: left;
  width: 33.33%;
  background-color: cyan;
  border-left: 1px solid black;
  border-right: 1px solid black;
  margin: 0 5px;
}

.col-3 {
  float: left;
  width: 33.33%;
  background-color: magenta;
  border-left: 1px solid black;
  margin-left: 5px;
} 

上面的代码添加了一个边框和一些左右间距，以区分各列之间的不同。这些样式和代码示例可以帮助您了解如何使用CSS来创建具有三列排序的网页布局。