Question

嘿，所以我的朋友经营这家网络公司。他告诉我他想对他的网站做一些改动。如果我告诉他我可以处理它，他会雇用我一些东西。

大部分时间我处理得很好。但我无法弄明白这一点。

如果你去他的网站（下面链接）并将鼠标悬停在最近工作的圆形加号图标上。阴影切换为蓝色。我希望它保持橙色。

有什么想法吗？

P.S。我改变了图标颜色，阴影颜色等......只是无法弄清楚如何改变这一点。

*已删除链接

谢谢！

以下相关代码：

.posts-grid.works li .featured-thumbnail .zoom-icon::after {
    background: #E35F33 none repeat scroll 0% 0%;
}
.posts-grid.works li .featured-thumbnail .zoom-icon {
    box-shadow: 0px 0px 0px 6px rgba(227, 95, 51, 0.2);
}

Answer 1

您可以删除以下代码：

.posts-grid.works li .featured-thumbnail .zoom-icon:hover {
    -webkit-box-shadow:0 0 0 6px rgba(90,206,205,0.4);
    -moz-box-shadow:0 0 0 6px rgba(90,206,205,0.4);
    box-shadow:0 0 0 6px rgba(90,206,205,0.4);
}

这似乎解决了这个问题。

Answer 2

您的问题是CSS特异性之一：

这是你要覆盖的选择器：

.posts-grid.works li .featured-thumbnail .zoom-icon:hover { ... }

这是你的选择器：

.posts-grid.works li .featured-thumbnail .zoom-icon { ... }

如果您不能或不想删除第一个选择器，请使您的选择器更具体。

参考：

Specificity - CSS | MDN

阴影颜色后无法更改CSS ::

2 个答案: