如何删除 Squarespace 中的悬停效果？

Question

所以我不知道如何删除我正在处理的朋友网站上的悬停效果...我不想在此处的箭头上看到悬停背景：

http://adam-smith-0nvq.squarespace.com/drawings-paintings

悬停效果显示在这里：http://d.pr/i/SyYt

我怎样才能改变它，让它不再悬停在上面？

Answer 1

对于这样的说明性问题，我总是建议检查元素并将相关代码片段与您的问题一起发布。通常，您会在这样做时找出这些基本的 CSS 问题。

将其放入您的自定义 CSS 文档中：

.sqs-gallery-controls .next:hover,
.sqs-gallery-controls .previous:hover {
  background-color: inherit;
}

如果您检查此元素，您会看到 SquareSpace 在这些箭头上有一个 .next 和一个 .previous class。这两个 classes 都有适用于它们的 伪 class :hover 的规则。所以基本上他们在这个伪 class 上使用 background-color: rgba(0,0,0,0.2);，创建透明的黑色背景。

通过在上面插入 CSS 来覆盖它，以便在悬停时，该元素继承其 class 的主要背景规则，什么都不是（或您将来将其更改为的任何内容） ).

希望对您有所帮助。

Answer 2

只需在悬停时将 background-color 设置为透明

.sqs-gallery-controls.show-hover-effect a:hover {
  background-color: transparent;
}

如何删除 Squarespace 中的悬停效果？

How do I remove a hover effect in Squarespace?

css

hover

squarespace