How to insert icons pseudo content

.css:after {
    content: "\86";
    color: red;
}
.css.char:after {
    content: "†";
    color: blue;
}
.data:after {
    content: attr( data-icon );
}
.js:after {
    content: attr( data-icon );
}
.red:after {
    color: red;
}
.blue:after {
    color: blue;
}

Source: stackoverflow.com

How to insert icons pseudo content

<div class="css">hard coded css content</div>
<div class="css char">hard coded css content char</div>
<br>
<div class="data red" data-icon="†">hard coded data-icon</div>
<div class="data blue" data-icon="†">hard coded data-icon char</div>
<br>
<div class="js red">data-icon by js</div>
<div class="js blue">data-icon by js char</div>

Source: stackoverflow.com

Similar codes

0 vote352 views1 answer
Tailwind accordion
CSS
0 vote295 views1 answer
Css disable transition on first load
CSS
0 vote326 views1 answer
Css add required asterisk after
CSS
1 vote354 views2 answers
Selector css
CSS
6 votes338 views2 answers
Transition prefixes css
CSS
2 votes359 views1 answer
Css preprocessor
CSS
11 votes304 views3 answers
Round button css
CSS
0 vote325 views2 answers
Css align image bottom
CSS
1 vote399 views1 answer
Import maxcdn.bootstrapcdn.com not in index.html in specific component file
CSS Bootstrap
1 vote340 views1 answer
Hide number trigger in html page
CSS