前端CSS基础6(CSS列表与表格的相关属性,边框的样式调整)
/* 设置表格的边框样式 */
table {
border-collapse: collapse; /* 折叠边框,使其看起来更整洁 */
}
/* 设置表格单元格的边框样式 */
th, td {
border: 1px solid black; /* 设置单元格边框为1px宽的黑色实线 */
padding: 8px; /* 设置单元格内容与边框之间的填充为8px */
}
/* 设置列表的样式 */
ul.list-style {
list-style-type: square; /* 列表项前的标记为方块 */
padding-left: 20px; /* 列表项内容距离左侧的填充为20px */
}
/* 设置列表项之间的间距 */
ul.spacing-list li {
margin-bottom: 5px; /* 列表项之间的间距为5px */
}
这段代码展示了如何使用CSS来调整表格和列表的边框样式,包括折叠边框、边框宽度、样式和颜色,以及内容与边框的填充。这些是前端开发中常用的CSS属性,对于学习者来说具有很好的示例价值。
评论已关闭