Как изменить цвет категории div

Question

Хорошо, у меня есть мои категории, завернутые в div

<div id="categoryf">
  <?php $category = get_the_category();  echo $category[0]->cat_name;?>
</div>

и он показывает только первую категорию, как я хочу, но мое требование состоит в том, чтобы поместить определенные категории в разные div, чтобы я мог назначить другой цвет фона.

Как бы я этого достиг.

редактировать здесь мой CSS

#categoryf{ 
  position:absolute;
  padding:4px;
  width:auto;
  height:13px;
  margin-top:-86px;
  font-family:abeatbykairegular;
  font-weight:200;
  font-size:13px;
  font-weight:bold;
  letter-spacing:6px;
  color:#fff;
  background:#2d0748;
  overflow:hidden;
  z-index:2;
}

#categoryf a:link,
#categoryf a:visited{ 
color:#fff;
}
#categoryf a:hover{ 
color:#af77c0;
text-decoration:none;
}

Answer 1

Я бы использовал категорию slug, а затем создал бы CSS классы для них.

<?php $category = get_the_category(); ?>
<div id="categoryf" class="category-<?php echo $category[0]->slug ?>">
    <?php echo $category[0]->cat_name;?>
</div>

РЕДАКТИРОВАТЬ:

Чтобы у некоторых категорий был другой цвет, а у других такой же цвет. Просто определите category-common класс и включить это.

<?php $category = get_the_category(); ?>
<div id="categoryf" class="category-common category-<?php echo $category[0]->slug ?>">
    <?php echo $category[0]->cat_name;?>
</div>

Затем в CSS вы можете применять стили, как это.

.category-common {
      background-color: blue;
}

.category-business {
      background-color: green;
}

Убедитесь, что определили category-common сначала в CSS, а затем для любой категории, которую вы хотите другого цвета, просто объявите класс для на основе слаг.