使用jQuery在悬停下划线超链接

前端之家收集整理的这篇文章主要介绍了使用jQuery在悬停下划线超链接前端之家小编觉得挺不错的,现在分享给大家,也给大家做个参考。
我用过这个方法
  1. $("#dvTheatres a").hover(function (){
  2. $(this).css("text-decoration","underline");
  3. },function(){
  4. $(this).css("text-decoration","none");
  5. }
  6. );

有更优雅的方法吗?(单行)

解决方法

您可能遇到其他CSS规则的问题,这些规则会覆盖您想要的那个.即使它在文件中被声明为最后一个,其他声明也可能更重要,因此您将被忽略.例如:
  1. #myDiv .myClass a {
  2. color: red;
  3. }
  4. #myDiv a {
  5. color: blue;
  6. }

因为第一条规则更具体,所以它优先.这是一个解释CSS特异性的页面http://www.htmldog.com/guides/cssadvanced/specificity/

您的jQuery解决方案工作的原因是因为通过style =“”参数应用样式具有非常高的特异性.

查找正在应用哪些规则以及哪些规则被其他规则推翻的最佳方法是使用适用于Firefox的Firebug扩展.检查其中的元素并单击CSS选项卡:它将显示正在应用的每个CSS声明,并对被覆盖的那些声明进行删除.

如果您想要一种非常快速简便的方法解决您的问题,请尝试以下方法

  1. #dvTheatres a:hover {
  2. text-decoration: underline !important;
  3. }

如果你真的想坚持使用jQuery,你的方法很好,可能是最优雅的方式(使用jQuery).

猜你在找的jQuery相关文章