最近在给table里面的tr标签添加高亮背景色显示的时候,遇到一个坑,HTML结构如下:

  1. <tr>
  2.  
  3.   <td></td>
  4.  
  5.   <td></td>
  6.  
  7.   <td></td>
  8.  
  9.   <td></td>
  10.  
  11. </tr>

想要给tr标签添加一个鼠标滑过背景样式,但是td的样式会覆盖掉tr的样式,

需要特别处理一下:

  1. tr:hover{
  2.  
  3.   background-color: #ccc;
  4.  
  5. }
  6.  
  7. tr:hover td{
  8.  
  9.   background: none;
  10.  
  11. }

问题解决。

关于tr:hover变色的问题的更多相关文章

  1. tr:hover变色的问题

    做表格隔行变色(高亮显示),可以通过设置css中的 tr:hover伪类属性达到效果, 但是,会出一点小问题.td的背景色会覆盖tr的背景色, 在tr:hover下边加上一句:tr:hover td{ ...

  2. 一个简单的tr:hover效果

    昨天,搞项目的时候,在一个小问题上卡了40分钟,现在想想,还是平时比较少去注意一些细节,经过这次,一定要去多注意细节了. 好了废话不多说,我现在说明下遇到的问题,一个表格中,要求是当鼠标滑过每一行时, ...

  3. GridView固定行宽,自动换行,鼠标放在Table的Tr上变色

    //固定行宽table-layout:fixed;//自动换行word-break :break-all;word-wrap:break-wordGridView.Attributes.Add(&qu ...

  4. css - a:hover变色问题

    今天在帮我们学校做网站的时候,由于在css这里不是很擅长,过程中发现一个问题,a:hover的时候,字体的颜色不变.后来才发现将a和div的嵌套的问题, 我的css代码为: .left_box .lb ...

  5. jQuery table tr隔行变色,鼠标移入移出变色,鼠标点击变色

    .trover { background: #f9f9f9; } .trclick { background: #c4e8f5; } .treven{ background:#CCFFCC; } .t ...

  6. Js 实现 多个tr 点击变色,再点击还原

    我用的是渲染页面,将自定义的值作为一个表示符判断当前状态 <!DOCTYPE html> <html> <head> <meta charset=" ...

  7. Jquery的hover方法让鼠标经过li时背景变色

    来源地址:http://itfish.net/article/29790.html <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Trans ...

  8. tr td 移动变色

    jsp <table  id="tableList" class="table table-hover"></table> css .t ...

  9. Table tr 的隔行变色

    <style type="text/css">    table{border-collapse:collapse;border:1px solid #999;} td ...

随机推荐

  1. Angular material mat-icon 资源参考_File

    ul,li>ol { margin-bottom: 0 } dt { font-weight: 700 } dd { margin: 0 1.5em 1.5em } img { height: ...

  2. Rx

    more detailed in WIKI's document SDP :session description protocal book AAA AA-Answer 鉴权授权应答AAR AA-R ...

  3. django 迁移工程数据库无法创建的问题

    1.今天我遇到一个问题在此做笔记记下来 2.我晚上一般是在家练习的,白天会拷贝工程到公司用 3.因为我在家里创建过一次数据库了,通过命令创建,但是无论我怎么修改models都无法创建表,最后只能通过新 ...

  4. ORA-24247:网络访问被访问控制列表(ACL)拒绝

    今天将一个发送数据库监控邮件的procedure 从10g 迁移到11g,不工作了.处理记录如下: 在Oracle11g中,Oracle在安全方面有了很多的改进,而在网络权限控制方面,也有一个新的概念 ...

  5. (转)Linux-HA开源软件Heartbeat(配置篇)

    原文:http://ixdba.blog.51cto.com/2895551/548625 http://gzsamlee.blog.51cto.com/9976612/1828870 Linux-H ...

  6. centos 7编译安装php7

    0.下载php源代码 http://www.php.net/releases/ 1.配置编译环境 yum install -y gcc gcc++ libxml2-devel openssl open ...

  7. CoreJava笔记之线程

    程序,进程和线程程序:没有执行的指令序列和相关的数据的集合(如:qq.exe) 如:磁盘上的可执行命令进程:正在执行的程序,进程占用资源(CPU,Memoary,IO)线程:是进程中并发执行的过程(共 ...

  8. 基于Metronic4.1的Bootstrap脚本样式说明

    虽说Bootstrap作为当下最流行的响应式的UI,但是对于一些在Bootstrap基础上扩展的UI的资料算是少之又少.这里楼主结合这一个月的辛酸把那些脚本跟样式整理一下下... 关于Metronic ...

  9. ZOJ 2856 Happy Life

    Problem Description Do you know Utopia? It's a perfect world in which everyone leads a happy life. A ...

  10. Orcale 之子查询

    子查询和连接查询一样,都提供了使用单个查询访问多个表中的数据的方法.子查询在其他查询的基础上,提供一种进一步有效的方式来访问数据. IN 关键字 使用 IN 关键字可以将原表中特定的的值与子查询中返回 ...