CSS content & attr()

Exemplo de como usar o atributo de uma tag em seu conteudo via css

by Danilo Metzker

HTML

<div data-texto="Este é o texto do atributo 'data-texto'">
</div>

<div class="concat" data-texto="Este é o texto do atributo 'data-texto'">
</div>

<div data-texto="Este é o texto do atributo 'data-texto'">
com o conteudo da div
</div>

CSS

div[data-texto]:before{
  content: attr(data-texto);
  color:red;
}

div.concat[data-texto]:before{
  content: attr(data-texto) " concatenado";
  color:red;
}