列表组

创建于 2024-12-03 / 25
字体: [默认] [大] [更大]

了解如何使用 CSS 将基本列表转换为"列表组"。


List Group

  • Adele
  • Agnes
  • Billy
  • Bob
  • Calvin
  • Christina
  • Cindy

亲自试一试 »


如何创建列表组

步骤 1) 添加 HTML:

实例

<ul>
  <li>Adele</li>
  <li>Agnes</li>
  <li>Billy</li>
  <li>Bob</li>
  <li>Calvin</li>
  <li>Christina</li>
  <li>Cindy</li>
</ul>
步骤 2) 添加 CSS:

实例

ul {
  list-style-type: none; /* 删除项目符号 */
  padding: 0; /* 删除填充 */
  margin: 0; /* 删除边距 */
}

ul li {
  border: 1px solid #ddd; /* 为每个列表项添加细边框 */
  margin-top: -1px; /* 防止双边框 */
  background-color: #f6f6f6; /* 添加灰色背景颜色 */
  padding: 12px; /* 添加一些填充 */
} 亲自试一试 »

提示:转到我们的CSS 列表教程,了解有关 HTML 列表以及如何设置它们的样式的更多信息。



0 人点赞过