Question

我正在设计一个wordpress网站，并希望更改一组链接下的文字。我已经找到了这种款待，看起来很有希望： Solution to problem

不幸的是，这个解决方案对我不起作用。我使用＆＃34;简单自定义CSS＆＃34;来包含CSS。插件并包含像示例中所示的html代码。链接在那里，但没有显示文本。当我离开＆＃34;显示：无＆＃34;部分出来，我看到了所有三个文本块。我究竟做错了什么？

我在页面文件中的代码：

<a href="#" class="a-1">one</a>
<a href="#"class="a-2">two</a>
<a href="#"class="a-3">three</a>
<div class="element-1">hello one</div>
<div class="element-2">hello two</div>
<div class="element-3">hello three</div>

自定义css文件中的代码：

.element-1, .element-2, .element-3{
     display: none;
}
.a-1:hover  ~ .element-1 {
     display: block;
}
.a-2:hover  ~ .element-2{
     display: block;
}
.a-3:hover  ~ .element-3 {
     display: block;
}

Answer 1

这不适合你的原因:(不能确定，因为你没有链接你的代码）

<a href="#" class="a-1">one</a>

<div class="element-1">hello one</div>

您确定导入了相同的课程吗？

这可能是问题所在：class="a-1"＆amp; class="element-1"对你而言，如果你希望链接在鼠标悬停时改变颜色，你应该只使用

a:hover { 
    color: yellow;
}

如果您想为所有选项设置颜色：

a:link {
    color: #B2FF99;
}

a:visited {
    color: #FEFEFE;
}

a:hover {
    color: #323232;
}

a:active {
    color: #121211;
}

文章：http://www.w3schools.com/cssref/sel_hover.asp

Answer 2

我认为这就是你要找的，如果不让我知道的话。

<!DOCTYPE html>
<html>
<head>
<style>
a:link {
    background-color: #B2FF99;
}

a:visited {
    background-color: #FFFF85;
}

a:hover {
    background-color: #FF704D;
}

a:active {
    background-color: #FF704D;
} 
</style>
</head>
<body>

<p><b><a href="default.asp" target="_blank">This is a link</a></b></p>

</body>
</html>

Test this code here

Answer 3

WP-Style 看看我的WP-Backend（德语，抱歉;））

从1导航到2 - 在此文件中＆gt; style.css＆lt;你可以编辑你网站的风格。

3粘贴你的代码。请记住为您的元素使用相同的ID和类！

然而，就像Katherina提到的那样，我们需要看到你的代码！

Answer 4

来自moesphemie的回答：

嘿，检查一下这个关于〜stackoverflow.com/questions/10782054/…的问题尝试将a＆＃39; s和元素放在一个div中，也许包装p会切断这些元素之间的联系

在鼠标悬停链接时更改文本

4 个答案: