css td 样式

递上爱意 6个月前 153浏览 0评论

CSS中的样式可以控制网页的外观,其中标签也可以使用CSS样式进行控制。

td {
  border: 1px solid black;
  padding: 10px;
  text-align: center;
}

以上是一个基本的样式,其中border属性控制边框的样式(实线黑色边框),padding属性控制单元格内部的边距,text-align属性控制单元格内部文本的对齐方式。

td:first-child {
  background-color: #E6E6FA;
}

td:last-child {
  background-color: #ADD8E6;
}

除了基本样式之外,我们也可以针对某些特定的单元格应用不同的样式。例如,以上样式分别控制第一个单元格和最后一个单元格的背景色。

td:nth-child(odd) {
  background-color: #F5DEB3;
}

td:nth-child(even) {
  background-color: #FFFFE0;
}

甚至,我们可以对奇数行和偶数行的单元格应用不同的样式。以上样式分别控制奇数行和偶数行的单元格背景色。

总的来说,标签的样式可以控制单元格的背景色、边框样式、内部文本对齐方式等,使表格更加美观和易读。