[分享]css中如何让li在一行

CSS中让同一个ul中的li标签在一行显示是一个常见需求，可以通过如下的几种方式实现。

/* 使用float属性 */
li {
  float: left;
}

/* 使用inline属性 */
li {
  display: inline;
}

/* 使用display: flex属性 */
ul {
  display: flex;
}

li {
  flex: 1;
}

/* 使用display: inline-block属性 */
li {
  display: inline-block;
  *display: inline; /* 兼容IE6~7 */
  zoom: 1; /* 兼容IE6~7 */
} 

以上是几种常见的方式，其中有两种是使用display属性，display属性是常用的CSS属性之一，它可以控制标签的显示方式。使用display属性可以将inline元素转换成block元素，反之也可以将block元素转换成inline元素，这样就能够控制标签的大小、位置及排列方式等。