css - CSS中的ID被<a> color属性覆盖

这是表的创建。第一列与其余链接相同，即“编辑”，“详细信息”和“删除”

<tr>
        <td>
           @Html.ActionLink(item.Title, "Details", new { id = item.ID }, htmlAttributes: new {id = "myclass"})
        </td>
        <td>
            @Html.DisplayFor(modelItem => item.ReleaseDate)
        </td>
        <td>
            @Html.DisplayFor(modelItem => item.Genre)
        </td>
        <td>
            @Html.DisplayFor(modelItem => item.Price)
        </td>
        <td>
            @Html.ActionLink("Edit", "Edit", new { id=item.ID }) |
            @Html.ActionLink("Details", "Details", new { id=item.ID }) |
            @Html.ActionLink("Delete", "Delete", new { id=item.ID })
        </td>

        

下面是我的CSS类

a {
    color: #333;
    outline: none;
    padding-left: 3px;
    padding-right: 3px;
    text-decoration: underline;
}

/*.linkproperties{
    color: aqua;
}
#myclass .linkproperties { color: blue;} works fine*/

    #myclass .a {颜色：蓝色；} /不起作用/

如上所述，如果我创建自己的类（.linkproperties），请将其附加到“编辑”，“详细信息”和“删除”动作链接上，并使用#myclass覆盖它，但是#myclass .a不会发生相同的情况。 {color：blue}

最佳答案

在这种情况下，您应该使用CSS中的!important属性显式覆盖声明。

a {
    color: #333;
    outline: none;
    padding-left: 3px;
    padding-right: 3px;
    text-decoration: underline;
}

.linkproperties{
    color: aqua !important;

这将导致浏览器忽略CSS属性的典型继承和下沉，并使用!important属性应用任何属性，而不管行上或下的某些内容是否通常会覆盖它。

编辑

阅读问题的错误部分。我的原则仍然适用，但需要转移到新的位置。另外，摆脱。在a前面，.a是一个ID，a是一个超链接。

CSS

#myClass a {color: blue !important;}

HTML

 <td class="myClass">
            @Html.ActionLink("Edit", "Edit", new { id=item.ID }) |
            @Html.ActionLink("Details", "Details", new { id=item.ID }) |
            @Html.ActionLink("Delete", "Delete", new { id=item.ID })
        </td>

最后，这是显示工作结果的JSFiddle（使用实际的链接而不是@ Html.ActionLinks

关于css - CSS中的ID被<a> color属性覆盖，我们在Stack Overflow上找到一个类似的问题：https://stackoverflow.com/questions/19803126/