Wordpress：CSS中用于div背景图像的条件标签？答案

【问题标题】：Wordpress: Conditional tag in css for div background image?Wordpress：CSS中用于div背景图像的条件标签？
【发布时间】：2013-10-14 21:41:28
【问题描述】：

对于我博客上的元数据类别，我将循环的那部分放在它自己的带有背景图像的 div 中。我想根据该帖子的类别更改背景图像。我相信我可以在 css 中使用一组条件标签来做到这一点（类似于 if category () echo red.png）关于从哪里开始或是否有可能的任何想法？该站点是 blog.printstitchandpaste.com，要更改的图像是类别名称后面的小标志/横幅。谢谢！

【问题讨论】：

标签： php css wordpress conditional-statements

【解决方案1】：

在你的 CSS 中，你可以有类似的东西：

.category_callout.cat-1-slug {
  background-image: url('category-1-image.jpg');
}
.category_callout.cat-2-slug {
  background-image: url('category-2-image.jpg');
}

等等。

在你的主题中，你有你的.category_callout div，获取类别并回应蛞蝓。例如：

<div class="category_callout <?php foreach( get_the_category() as $cat ) { echo $cat->slug . ' '; } ?>">

这将添加所有帖子类别 slug。如果您只想使用第一个类别，请执行以下操作：

<?php $cat = get_the_category(); ?>
<div class="category_callout <?php echo $cat[0]->slug; ?> ">

见http://codex.wordpress.org/Function_Reference/get_the_category

【讨论】：

php 的第二段代码能在引号内工作吗？另外，对于第一段代码，我需要类别编号还是可以直接称它们为 cat-slug？
第一段代码，你是指CSS吗？我不知道您的类别名称，所以我只输入了 .cat-1-slug 和 .cat-2-slug。如果您的类别名称类似于“Hello world”，则 slug 很可能是 hello-world，因此您可以在 CSS 中使用：.category_callout.hello-world。我不明白关于 php 的问题...