css中li怎么横向显示

CSS中使用

标签横向显示可以通过设置display属性的值为inline或inline-block。下面是实现横向显示的样式代码：

ul {
  list-style:none;
  padding:0;
  margin:0;
}
li {
  display:inline-block; /* 该属性值可以改为inline */
  margin-right:10px; /* 控制

之间的间距 */ }

以上代码表示将无序列表去掉默认的圆点样式，设置padding和margin为0，然后将

元素显示为内联块级元素。（也可以设置为内联元素）

特别要注意的是，将li元素设置为display:inline或inline-block时，如果li元素中包含块级元素，如

或

，那么该块级元素可能会影响到布局，导致布局错误。此时可以将该块级元素设置为inline或inline-block实现布局。

上一篇：css3动画特效免费下载 下一篇：css3写一个闪烁的原点