首页
学习
活动
专区
工具
TVP
发布
精选内容/技术社群/优惠产品,尽在小程序
立即前往

将<li>标签的长列表分成列?

<li> 标签的长列表分成列,可以使用 CSS 的 column 属性。具体操作如下:

  1. 首先,在 HTML 中为 <ul> 标签添加一个类名,例如 column-list
代码语言:html
复制
<ul class="column-list">
  <li>列表项 1</li>
  <li>列表项 2</li>
  <li>列表项 3</li>
  ...
</ul>
  1. 接下来,在 CSS 中为 .column-list 类添加 column 属性,并设置 column-countcolumn-gap 的值。
代码语言:css
复制
.column-list {
  column-count: 3; /* 列数 */
  column-gap: 20px; /* 列间距 */
}

这样,<li> 标签的长列表就会被分成三列,并且列间距为 20px。

需要注意的是,column 属性在不同的浏览器中可能有兼容性问题,因此建议使用浏览器前缀,例如 -webkit-column-count-webkit-column-gap

页面内容是否对你有帮助?
有帮助
没帮助

相关·内容

领券