At w3schools has the reference of all the characters - special, symbols, alphanumeric. I did not understand the purpose of having this representation of the characters. In the example below the output is the same, it only changes the entity.
CSS entity
and / or when to use the character? .copy1:before{content:'<div class="copy1"></div>
<div class="copy2"></div>
<div class="copy3"></div>
<div class="copy4"></div>
A9'; margin-right:3px}
.copy2:before{content:'©'; margin-right:3px}
.copy3:before{content:'.copy1:before{content:'<div class="copy1"></div>
<div class="copy2"></div>
<div class="copy3"></div>
<div class="copy4"></div>
A9'; margin-right:3px}
.copy2:before{content:'©'; margin-right:3px}
.copy3:before{content:'%pre%41'; margin-right:3px}
.copy4:before{content:'A'; margin-right:3px}
A9 => ©
© => ©
%pre%41 => A
A => A
41'; margin-right:3px}
.copy4:before{content:'A'; margin-right:3px}
A9 => ©
© => ©
%pre%41 => A
A => A