css - 站点范围的链接淡入淡出不包括一个元素

Question

我是 CSS 新手。所以请原谅我可能非常无知的问题。

我正在努力在悬停在我网站上的链接/菜单项上时添加淡入淡出效果。我找到了一段代码来完成我在下面列出的技巧。但是，我正在寻找一种简单的方法来排除它影响我的主页内容。此代码使幻灯片的过渡时间断断续续且缓慢。有没有一种方法可以简单地将其排除在影响主页内容之外？

a {
-webkit-transition:all 200ms ease-in;
-o-transition:all 200ms ease-in;
}

谢谢!

Answer 1

添加另一个 CSS 规则，使用更具体的选择器覆盖它并禁用转换。例如，如果您要排除的链接的 ID 为“slideshow-link”:

a {
  -webkit-transition: all 200ms ease-in;
  -o-transition: all 200ms ease-in;
}

a#slideshow-link {
  -webkit-transition: none 0ms ease;
  -o-transition: none 0ms ease;
}

或者排除 .content div 中的所有链接:

.content a {
  -webkit-transition: none 0ms ease;
  -o-transition: none 0ms ease;
}