添加带有图像的悬停效果（wordpress）

Question

将图像透明度 - 悬停效果添加到 wordpress 的最佳解决方案是什么？我有几个公司的标志，我想让它们褪色，直到你将鼠标悬停在它们上面……有一个简单的解决方案吗？正在寻找正确的代码和 css...非常感谢。

Answer 1

首先为您的所有公司徽标图像定义一个类 -

<img class="company-logo" src="..."/>

然后像这样为 company-logo 类添加 CSS -

img.company-logo {
    opacity: 0.5; /* Set this to whatever value you want */
    filter: alpha(opacity=50);
}

img.company-logo:hover {
    opacity: 1; /* make the images fully opaque */
    filter: alpha(opacity=100);
}