简体   繁体   English

使用CSS突出显示行

[英]Highlight row using CSS

The following is a class which I use to highlight a row, but it only makes changes for the cursor and font, not bgcolor of a row. 以下是我用来突出显示行的类,但它仅更改cursor和字体,而不更改行的bgcolor

I have also used background-color: #FFDC87; 我还使用了background-color:#FFDC87; but it fails to get the desired output. 但无法获得所需的输出。

.highlighted {

    bgcolor: #FFDC87;
    cursor          : pointer;
    /*font-size : 50px;*/
}

How can I make it work? 我该如何运作?

That's because the bgcolor CSS property doesn't exist. 那是因为bgcolor CSS属性不存在。 The property you're looking for is background-color . 您要查找的属性是background-color

If this doesn't work, there's something else that is messing with the element's background-color , and is blocking this from working. 如果这不起作用,则说明还有其他东西弄乱了元素的background-color ,并阻止了它的工作。 But we'll need a little more code to help you with that. 但是,我们需要更多代码来帮助您。

As is clear by the other answers, it's background-color instead of bgcolor . 从其他答案可以明显看出,它是background-color而不是bgcolor Note that you can see if there are errors in your HTML, JS or CSS code if you're using a plug-in like Firebug or Webdeveloper (both Firefox plug-ins). 请注意,如果您使用的是FirebugWebdeveloper之类的插件(均为Firefox插件),则可以查看HTML,JS或CSS代码中是否有错误。 This is what Webdeveloper mentioned: 这是Webdeveloper提到的:

alt text http://img191.imageshack.us/img191/7469/csserror.png 替代文字http://img191.imageshack.us/img191/7469/csserror.png

And you'll probably also want to make the table's borders collapse, otherwise the rows in your table will have gaps in it. 而且,您可能还希望折叠表格的边框,否则表格中的行将有空隙。 Here's what you could do: 您可以执行以下操作:

<html>
  <head>
    <style>
      table {
        border-collapse: collapse;
      }
      td {
        padding-right: 10px;
      }
      .highlighted {
        background-color: #ffdc87;
        cursor: pointer;
      }
    </style>
  </head>
  <body>
    <table>
      <tr class="highlighted">
        <td>1</td><td>11</td><td>111</td>
      </tr>
      <tr>
        <td>2</td><td>22</td><td>222</td>
      </tr>
      <tr class="highlighted">
        <td>3</td><td>33</td><td>333</td>
      </tr>
      <tr>
        <td>4</td><td>44</td><td>444</td>
      </tr>
      <tr class="highlighted">
        <td>5</td><td>55</td><td>555</td>
      </tr>
    </table>
  </body>
</html>

Instead of bgcolor, the CSS rule is background-color . CSS规则不是bgcolor,而是background-color Give that a try. 试试看。

The CSS for background color is "background-color", eg background-color: #FFDC87; 背景颜色的CSS是“ background-color”,例如background-color:#FFDC87;

Try that :) 试试看:)

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM