Как менять цвет блока с помощью id?

В новой 12 версии скрипта есть возможность вставлять ид категории, для изменения цвета блока. У меня есть блок, в котором я вывожу {link-category}, как сделать для каждой из категории свой цвет? Что нужно добавить или исправить подскажите пожалуйста

HTML:

<div class="post-cat-info clearfix"><div class="cat-info-el">{link-category}</div></div>

Код:

.cat-info-el a {
    position: relative;
    display: block;
    float: left;
    margin-top: 1px;
    margin-bottom: 1px;
    margin-left: 5px;
    padding: 0 12px;
    -webkit-border-radius: 4px;
    border-radius: 4px;
    background-color: #55acee;
    color: #fff;
    text-shadow: none;
    font-size: inherit;
    line-height: 20px;
    -webkit-transition: all .3s ease-in-out;
    -moz-transition: all .3s ease-in-out;
    -ms-transition: all .3s ease-in-out;
    -o-transition: all .3s ease-in-out;
    transition: all .3s ease-in-out;
    pointer-events: auto;
}

Например, чтобы для категории id1 был цвет #ccc
id2 - #282828 и т.д.

 

[атрибут~="значение"] | htmlbook.ru

upd: хотя не то немного...

 

byroot именно то

 

Правильно ли я понимаю, что вместо "значение" нужно вставить тег {category-id} чтобы у каждого блока был определенный цвет?

 

блин, прикол в том, что {category-id} для каждой категории проставляет id 1, тем самым блоки будут одинакового цвета... Как сделать чтобы блоки получились разного цвета в зависимости от категории?

 

Попробуй это. Но надо постараться. Можно и без ид. Псевдокласс :nth-child | htmlbook.ru