JSFiddle - React, Tailwind, and code Playground

HTML

<a class="first" href="http://f.cl.ly/items/2A2d1D1s3N2x3B0T1v1i/cica.jpeg">anchor</a>
<a class="sec" href="http://f.cl.ly/items/2A2d1D1s3N2x3B0T1v1i/cica.jpeg">anchor</a>
<a class="third" href="http://f.cl.ly/items/2A2d1D1s3N2x3B0T1v1i/cica.jpeg">anchor</a>

CSS

a {
  display: block;
}
/*first works as expected*/
.first:before {
  content: url(http://f.cl.ly/items/0s2s0g3l0L3l0n0X1U3U/tumblr_m5tlp5FTPy1qa42jro1_r1_1280.png);
}
/*second works as expected*/
.sec:before {
  content: attr(href);
}
/*thirds doesnt work*/
.third:before {
  content: attr(href);
  background-image: url(attr(href));
}