Question

我有以下工作：

#s5_bottom_menu_wrap a{
color:#333333 !important;
}

我希望能够添加以下内容：

a:link {text-decoration:none;}
a:visited {text-decoration:none;}
a:hover {text-decoration:underline;}
a:active {text-decoration:none;}

然而，当我这样做时：

#s5_bottom_menu_wrap a{
color:#333333 !important;
a:link {text-decoration:none;}
a:visited {text-decoration:none;}
a:hover {text-decoration:underline;}
a:active {text-decoration:none;}
}

...在Google Chrome的Inspect Element中，它为添加的CSS显示错误“未知属性名称”，并且它没有任何效果。我正在尝试做的是做设计想要的是让这些导航链接没有装饰并且仅在悬停时强调链接。

我做错了什么？如何添加这些文字装饰？</ p>

我已根据我在这里得到的答案尝试了这个，这是正确的吗？

/* bottom section Nav links in footer */
#s5_bottom_menu_wrap a{ color:#333333 !important; text-decoration:none;}
#s5_bottom_menu_wrap a:link {text-decoration:none;}
#s5_bottom_menu_wrap a:visited {text-decoration:none;}
#s5_bottom_menu_wrap a:hover {text-decoration:underline;}
#s5_bottom_menu_wrap a:active {text-decoration:none;}

Answer 1

你不能在CSS中嵌套选择器，你需要这样做

#s5_bottom_menu_wrap a:link,
#s5_bottom_menu_wrap a:visited,
#s5_bottom_menu_wrap a:hover,
#s5_bottom_menu_wrap a:active {
   /* Styles goes here */
}

如果您希望嵌套方便，那么请查看CSS预处理器，例如LESS或SASS

Answer 2

您要将样式添加到:link元素的css样式块内的:visited，:hover，:active和a。那样不行。而是尝试以下

#s5_bottom_menu_wrap a{ color:#333333 !important; text-decoration:none; }

#s5_bottom_menu_wrap a:hover {text-decoration:underline;}

如何在CSS中添加装饰链接？

2 个答案: