1

目标:在用户鼠标悬停时为 Wordpress 生成的标签云随机分配不同颜色的 CSS 背景。

我的方法(到目前为止不成功):

        <?php 
            $colors = array( 0 => "#645676", "#427048", "#654335", "#ab2805", "#a59d57", "#302f2f", "#81510d" );
            $tags = wp_tag_cloud('smallest=10&largest=10&unit=px&number=40&format=array&echo=0'); 
            shuffle($tags); 
            foreach ($tags as $tag) { 
                    shuffle($colors);
                echo "<li style=\"a:hover=background:".$colors[0].";\"> $tag \n </li>"; 
            } 
        ?>

我认为 foreach PHP 循环将是最简单的方法。我创建了两个数组($colors 和 $tags)。我用我想要使用的颜色的十六进制标签手动填充了 $colors。$tags 由 wordpress 标签云数组填充(如果有兴趣,请在此处了解更多信息:http: //codex.wordpress.org/Function_Reference/wp_tag_cloud),我已将其设置为获取此博客上 40 个最受欢迎的标签。

然后我在 $tags 上使用 PHP shuffle 函数来混合前 40 个标签,通过 foreach 循环运行这 40 个标签,然后随机分配一个混洗的 $colors 到一个 CSS 伪类,该类得到回显。

该代码有效,这是输出示例:

<li style="a:hover=background:#302f2f;"> <a href='http://localhost:8888/nutritionwonderland_2/tag/truvia/' class='tag-link-49' title='3 topics' style='font-size: 10px;'>truvia</a> 
 </li><li style="a:hover=background:#81510d;"> <a href='http://localhost:8888/nutritionwonderland_2/tag/cancer/' class='tag-link-8' title='11 topics' style='font-size: 10px;'>cancer</a> 
 </li><li style="a:hover=background:#427048;"> <a href='http://localhost:8888/nutritionwonderland_2/tag/antioxidants/' class='tag-link-93' title='4 topics' style='font-size: 10px;'>antioxidants</a> 
 </li>

问题:当我将鼠标悬停在任何标签上时,背景永远不会出现。这让我觉得 CSS 可能很糟糕。

花生画廊的几个问题:
1)如何通过 PHP 随机应用 CSS 伪类?
2)即使这样可行,这里的 CSS 输出是否符合标准?
3)我应该担心这里的标准吗?

有兴趣听到任何回复 - 提前感谢您的时间。

4

3 回答 3

0

跳出来的第一件事。如果您只是更改背景色而不更改其余与背景相关的项目,则最好使用背景色作为要更改的目标元素。其次,我可能会在样式表中呈现 css,即使是随机化,并为每个 a 标签提供适当的类

<li class="pseudo_01"> <a href='http://localhost:8888/nutritionwonderland_2/tag/truvia/' class='tag-link-49' title='3 topics' style='font-size: 10px;'>truvia</a> 

<style>
.pseudo_01{
...
}
</style>
于 2010-11-08T20:01:59.070 回答
0

如何在内联 CSS 中编写 a:hover?

简短的回答:你不能。

长答案:你不应该。

给它一个类名或一个 id 并使用样式表来应用样式

:hover 是一个伪选择器,对于 css,只在样式表中有意义。没有等效的内联样式(因为它没有定义选择标准)。

于 2010-11-08T20:01:18.860 回答
0

我认为您需要为此使用javascript。PHP 是服务器端的,因此您无法在鼠标悬停时选择随机颜色。我可能完全误解了这个问题;我假设您不想在页面加载时简单地选择随机颜色并在每次鼠标悬停时显示相同的颜色。

于 2010-11-08T20:21:30.327 回答