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

7 votes274 views3 answers
Css stop text wrapping
CSS
0 vote265 views2 answers
Background image path
CSS
-1 vote276 views2 answers
Css clip-path
CSS
0 vote500 views1 answer
Création forme geometrique 5 cote html css
CSS
0 vote310 views1 answer
Time an element to disappear css
CSS
0 vote287 views1 answer
How to disable margin collapse between parent and child
CSS
0 vote291 views1 answer
How to code color css property
CSS
0 vote570 views1 answer
Fgg
CSS
8 votes318 views3 answers
Css max one line three dots
CSS
0 vote271 views1 answer
How to scale pixels in css
CSS