如何覆盖样式背景颜色?

时间:2020-11-10 09:56:10

标签: html css xml

我正在执行此xsl文件,并试图创建一种天气,其中顶部标头需要使用与背景颜色不同的颜色,但是样式颜色将继续覆盖给定的颜色。有没有办法纠正这个问题?

<style> <!--background color of blue and green-->

        tbody>tr:nth-child(odd){
        background-color: blue; }
        
        tbody>tr:nth-child(even){
        background-color: green; }
        </style>
  </head>
  <body>
    <h1> <xsl:value-of select="@qLocation"/> 
          [<xsl:value-of select="@qTime"/>] </h1>


    <table border="1" style="border:1px solid black;">
        <tr >  
            <th style="background-color:orange">Date</th> <!--this color should appear as orange but is overridden by the style-->
            <th>Weather data</th>
            <th>Highest</th>
            <th>Lowest</th>
        </tr>

1 个答案:

答案 0 :(得分:0)

您的问题是在CSS中引用了th标签。您是这样指定的:

tbody>tr:nth-child

这是必须的:

tbody>tr th:nth-child

您的html结构中也缺少tbody标签。

tbody>tr th:nth-child(odd){
        background-color: blue; }
        
tbody>tr th:nth-child(even){
        background-color: green; }
<table border="1" style="border:1px solid black;">
    <tbody>
        <tr>  
            <th style="background-color: orange">Date</th>
            <th>Weather data</th>
            <th>Highest</th>
            <th>Lowest</th>
        </tr>
     </tbody>
</table>