Question

我的Wordpress网站显示了标题和类别超过特色图片。

我希望文字为#ffffff（白色）。我成功地将目标锁定在我的css中，但“类别”并没有像标题后那样改变颜色。

CSS

.title-styling {
  width: 85%;
  position: relative;
}

.title-styling h1 {
  color: #fff;
  font: 700 60px/50px "Open Sans";
}

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

HTML

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

.title-styling h1 {正确更改了文字大小和文字颜色但只有.title-styling h2 {的文字大小已更改（我尝试使用和不使用!important）

Answer 1

我认为问题是<h2>标记有“更具体”类，请尝试更改您的CSS：

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

Answer 2

您可以执行以下操作之一： -

删除class =＆＃34; box-meta＆＃34;来自h2标签

OR

包含一个css类＆＃34; box-meta＆＃34;在你的css文件中

在css中定位'类别'

2 个答案: