Question

我不是交易编码人员，而是在工作中与Wordpress网站合作。我目前正在使用一个使用Owl Carousel的插件，并且我添加了自定义CSS，以便在旋转木马的一部分悬停时更改背景和文本颜色。我也想改变当前的图标符号（即png图像）。

我遇到了这个困难，想知道它是否甚至可以单独使用CSS，因为我不能在网站的后端工作。

您可以在下面找到我想要完成的图片。这里也是一个链接。

https://www.radiustheme.com/demo/wordpress/miako/home-3/
（这不是我使用的主题，但我相信Owl Carousel也在使用。）

任何建议或建议都会有所帮助。

Answer 1

我相信有几种不同的方法可以实现这一目标，第一种方法是现在最容易使用，也可能是现在最常用的方式，而且它使用的是SVG而不是PNG＆＃39; s对于特定元素，例如在悬停时需要更改颜色的图标。

SVG可以很容易地执行此操作，您可以为SVG元素设置ID或类，并使用hover属性简单地通过CSS触发所述SVG的颜色更改。示例 HERE

或者，如果网站的观看者在现代浏览器上，您可以使用CSS过滤器在悬停时更改图像的亮度，这是一个例子。如果它不够亮，请增加亮度百分比，直到它足够白：

filter: brightness(150%);
-webkit-filter: brightness(150%);
-moz-filter: brightness(150%);
-o-filter: brightness(150%);
-ms-filter: brightness(150%);