css中用盒模型制作表格 |css怎么用rgb

/* 表格样式 */
table {
border-collapse: collapse; /* 删除表格边框与cell边框的间隙 */
width: 100%; /* 表格占满整个容器 */
}
td, th {
padding: 10px; /* 单元格内边距 */
border: 1px solid #ccc; /* 单元格边框 */
}
th {
background-color: #eee; /* 表头背景颜色 */
font-weight: bold; /* 表头文字粗体 */
text-align: left; /* 表头文字居左 */
}
/* 设置表格中的一行 */
tr:nth-child(even) {
background-color: #f2f2f2; /* 偶数行背景颜色 */
}
/* 设置表格中某个单元格 */
td:nth-child(2) {
text-align: center; /* 第2列文字居中 */
font-style: italic; /* 第2列文字斜体 */
}

上述代码中，大家给表格设置了一个宽度为100%的宽度，并使用了border-collapse属性来删除表格边框与cell边框的间隙，以达到更加美观的效果。同时，大家给单元格设置了padding、border等样式，以及表头的背景颜色、粗体、居左等样式。

除此之外，大家还利用伪类nth-child来设置表格中一行和某个单元格的样式。例如大家设置了偶数行的背景颜色为灰色，并将第2列文字居中，样式更加丰富。

总之，利用CSS中的盒模型制作表格可以让大家更好地掌控表格的样式，实现更灵活的布局效果。