目标:在用户鼠标悬停时为 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)我应该担心这里的标准吗?
有兴趣听到任何回复 - 提前感谢您的时间。