CSS attr()

Merhaba, CSS'de attr() kulanmak istiyorum ama bir türlü çalıştıramadım. Sorunu bilen var mı?
Yapmak istediğim arkaplan rengini HTML üzerinden vermek.

<div class="mb-3 cat" data-background="red">
  <a href="http://www.google.com.tr/">Google</a>
</div>

.cat {  
  background-color: attr(data-background);
}

Edit: Sanırım sadece content özelliğini kullanırken işe yarıyor bu attr() fonksiyonu. Yine de emin değilim.



Edit: Sorun çözüldü arkadaşlar. Düşündüğüm gibi sadece content ile kullanılıyormuş. Ama şöyle bir yöntemi de mevcutmuş:

<div class="mb-3 cat" style="--cat-bg-color: red;">
  <a rel="nofollow" href="http://www.google.com.tr/">Google</a>
</div>

.cat {  
  background-color: var(--cat-bg-color);
}

http://prntscr.com/lrbpuc