时间戳

首页 > 解决方案 > 我如何交替表格颜色并保持正文背景？

javascript - 我如何交替表格颜色并保持正文背景？

问题描述

（运行代码 PLS）我如何将黑色块颜色更改为白色，与表格的其余部分颜色相同

<body style="background-color:black;">
<div style="color: white;">
<script>
    var colors = ["#f2f2f2", "#919191"];
    var colorIndex = 0;
    function changeColor() {
        var col = document.getElementById("body");
        if( colorIndex >= colors.length ) {
            colorIndex = 0;
        }
        col.style.backgroundColor = colors[colorIndex];
        colorIndex++;
    }
</script>
<style>
.bouton{
  width: 200px;
  border: 3px solid black;
  border-radius: 15px;
}
table {
  font-family: arial, sans-serif;
  border-collapse: collapse;
  width: 100%;
}

td, th {
  border: 1px solid #ebebeb;
  text-align: left;
  padding: 8px;
}

tr:nth-child(even) {
  background-color: white;
}
td:nth-child(even) {
  background-color: white;
}
</style>

<table>
<tr>
<td>
<xmp>
<!--...-->
</xmp>
</td>
<td>
<xmp>
Defines a comment
</xmp>
</td>
</tr>
<tr>
<td>
<xmp>
<!DOCTYPE>
</xmp>
</td>
<td>
<xmp>
Defines the document type
</xmp>
</td>
</tr>
<tr>
<td>
<xmp>
<a>
</xmp>
</td>
<td>
<xmp>
Defines a hyperlink
</xmp>
</td>
</tr>
<tr>
<td>
<xmp>
<abbr>
</xmp>
</td>
<td>
<xmp>
Defines an abbreviation or an acronym
</xmp>
</td>
</tr>

dont pay atteton to this random text it would let me post causywe9yfywe yf w87f78wey f wef7 ywe f8we f87weyf we fwef87wef87yweqfqwief q fqwefweyf wuqydfwefwd w df ywdq f87wd8 fw8df wd w wd fw fywf w 8fwddf wdf wdd wf wi had too much code lol aueuauydyuwgudgasjhvjagefaifagfyus87agfgyufasuigdafyuf87agfg8tf7aiehgfhauy3gfyugsagf

标签： javascripthtmlcsshtml-table

解决方案

更改以下两条规则：

tr:nth-child(even) {
  background-color: white;
}
td:nth-child(even) {
  background-color: white;
}

到

tr {
  background-color: white;
}
td {
  background-color: white;
}

推荐阅读