How to get html data attribute value in css regular expressions

Question

This is my html. I gave the data as 190.

<ul>
   <li class="lecture" data-views="190"></li>
</ul>

This is my CSS code. I am trying to get the value of a data attribute dynamically. How can I get this value of data representations as width.

$aaa:attr(data-views);
ul li:before{
  content:$aaa;
}
[data-views='$aaa']{
font-size:40px;
}
ul li{
  width : $aaa;
}

Answer 1

Your SCSS creates the following CSS:

ul li:before {
  content: attr(data-views);
}

[data-views='$aaa'] {
  font-size: 40px;
}

ul li {
  width: attr(data-views);
}

This is absolutely correct CSS, but has 2 problems:

• [data-views='$aaa']probably not what you wanted [data-views]makes more sense. This will select the elements (having an effect on ..) that have the data-views attribute.
• width: attr(data-views)is legal, but not supported by any browser at the moment . Unfortunately, there is nothing you can do about it.

SASS ( CSS-) CSS, , CSS. "" CSS ( ) .