ul { list-style-type: none; margin: 0; padding: 0; } li { display: inline-block; margin-right: 10px; /* 水平居中排列 */ text-align: center; }
通过设置li标签的display属性为inline-block,可以让li标签水平排列,而不是像默认情况下垂直排列。同时为li标签添加margin-right属性,可以控制每个li标签之间的间距。如果想让li标签水平居中排列,只需要在ul标签上设置text-align属性为center即可。
ul { list-style-type: none; margin: 0; padding: 0; /* 左对齐排列 */ text-align: left; } li { display: inline-block; margin-right: 10px; }
如果想让li标签左对齐排列,只需要在ul标签上设置text-align属性为left即可。同样地,如果想要li标签右对齐排列,只需要在ul标签上设置text-align属性为right即可。
总之,CSS中通过设置属性值,可以实现li标签在水平方向上的各种排列方式,如水平居中、左对齐或右对齐等。