Javascript 为什么mozilla中的文本颜色溢出到单元格边框？_Javascript_Html_Css_Google Chrome_Firefox

Javascript 为什么mozilla中的文本颜色溢出到单元格边框？

javascript html css google-chrome firefox

Javascript 为什么mozilla中的文本颜色溢出到单元格边框？,javascript,html,css,google-chrome,firefox,Javascript,Html,Css,Google Chrome,Firefox,我用表格和javascript制作了一个简单的html来格式化它。但这些行为在firefox和chrome中都是出人意料的。文本颜色溢出到单元格边框 HTML代码：在这个html代码中。我添加了带有6行和1个标题的表标记 <!DOCTYPE html> <html> <head> <link rel="stylesheet" href="test.css" /> </head&

我用表格和javascript制作了一个简单的html来格式化它。但这些行为在firefox和chrome中都是出人意料的。文本颜色溢出到单元格边框

HTML代码：

在这个html代码中。我添加了带有6行和1个标题的表标记

<!DOCTYPE html>
<html>
<head>
    <link
    rel="stylesheet"
    href="test.css" />
</head>

<body bgcolor="#0b1b2a">
    
    
        <center><table id="table1" border='1' style="width: 100%;text-align: center;">
            <tr>
                <th>x</th>
                <th>y</th>
            </tr>
            <tbody id="tableContent">
                <tr>
                    <td>sample</td>
                    <td>not a sample</td>
                </tr>
                <tr>
                    <td>sample</td>
                    <td>not a sample</td>
                </tr>
                <tr>
                    <td>sample</td>
                    <td>not a sample</td>
                </tr>
                <tr>
                    <td>sample</td>
                    <td>not a sample</td>
                </tr>
                <tr>
                    <td>sample</td>
                    <td>not a sample</td>
                </tr>
                <tr>
                    <td>sample</td>
                    <td>not a sample</td>
                </tr>
            </tbody>
        </table></center>


</body>



<script src="test.js" type="text/javascript"></script>


</html>

JS代码：

在这个Java脚本代码中，我得到了所有td标记并比较了它们的值。如果文本等于“样本”，则其颜色为红色，否则为黄色

list_td = document.getElementsByTagName("td");
// Getting all td tags

for(elems in list_td){

    // Comparing the inner values and setting text color
    
    if(list_td[elems].innerHTML == "sample"){
        list_td[elems].style.color = "#f00"
    }
    else{
        list_td[elems].style.color = "#ff0"
    }
}

Firefox中的输出：

铬合金输出：

Firefox版本：82.0 Chrome版本：86.0.4240.183

tr,td{
  border-color: white;
}

试试这个

tr,td{
  border-color: white;
}