php - 定位类别 css

Question

在 wordpress 中，我的 content.php 中有一篇文章，它根据帖子的 featured-thumbnail 创建了一个图像网格。这段代码将帖子标题 (the_title();) 和类别标题 (the_category(', '))

HTML:

<div class="title-styling">
   <a href="<?php the_permalink(); ?>" rel="bookmark"><h1><?php the_title(); ?></h1></a>
   <a href="<?php the_permalink(); ?> "><h2><?php the_category(', '); ?></h2></a>
</div>

我想针对 the_category(', ') 文本的 css 属性，例如更改颜色填充等。但我的 CSS 似乎并没有影响它(尤其是颜色)，即使 !important 添加。

CSS(尝试失败):

.title-styling > h2 {
  color: #fff;
  font: 500 15px/10px "Open Sans";
}

.title-styling h2 {
 color: #fff;
 font: 500 15px/10px "Open Sans";
}

Answer 1

尝试使用以下内容

.title-styling > a > h2.title-category {
  color: #fff;
  font: 500 15px/10px "Open Sans";
}

如果你想删除 anchor 标记的下划线(链接)[可选]

.title-styling > a {
  text-decoration: none;
}

更新:

尝试为 h2 标签指定一个类以更具体地定位它

<div class="title-styling">
   <a href="<?php the_permalink(); ?>" rel="bookmark"><h1><?php the_title(); ?></h1></a>
   <a href="<?php the_permalink(); ?> "><h2 class="title-category"><?php the_category(', '); ?></h2></a>
</div>