如何创建 - 列表组
了解如何使用 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 列表以及如何设置它们的样式的更多信息。