css - Firefox li href CSS 选择器

Question

我使用 CSS 设置了一些列表项 (li) 的样式。样式应用于 li 中的选择器。它适用于 Chrome、IE 和 Safari，但不适用于 Firefox:

<ul class="organisations">
   <li class="community-care"><a href="http://adviceglos.org.uk/organisation-type/community-care/" title="View all posts in Community Care" >Community Care</a></li>
</ul>

这是 CSS:

ul.organisations li.community-care a {
background-image: -webkit-gradient(linear,center top,center bottom,color-stop(0%,#5CBCC4),color-stop(100%,#38939B));
background-image: -webkit-linear-gradient(#5CBCC4 0,#38939B 100%);
background-image: -moz-linear-gradient(#5CBCC4 0,#38939B 100%);
background-image: -o-linear-gradient(#5CBCC4 0,#38939B 100%);
background-image: -ms-linear-gradient(#5CBCC4 0,#38939B 100%);
background-image: linear-gradient(#5CBCC4 0,#38939B 100%);
background-color: #5CBCC4;
border: 1px solid #318188;
border-bottom-color: #245E63;
}

Answer 1

您的样式表中存在语法错误。特别是，第 529 行是:

background-image: -o-linear-gradient((#eeeeee 0,#ccc 100%) !important;

请注意，开括号比闭括号多一个。在符合规范的 CSS 解析器(不包括 WebKit)中，这会导致 UA 将匹配的闭括号之前的所有内容都视为背景图像值的一部分。在这种情况下，这是样式表的所有其余部分，因此忽略这一点之后的所有规则。

另外请注意，Firefox 确实在其错误控制台中报告了此问题，这就是我发现它的方式...