content property in CSS
css, css-content
Solution
Using `content` property embeds a virtual content inside an element, it is used with a pseudo `:before` or `:after`, so if you use `:before`, the content will be embedded before.
From MDN :
The `content` CSS property is used with the `::before` and `::after` pseudo-elements to generate content in an element. Objects inserted using the `content` property are anonymous replaced elements.
Content property can hold any character, number, entities. For more information, you can refer an article here.
Also, you can get an handy converter here.
This method is also used by font-awesome - Example and other related svg font embedding libraries, where you can simply call classes to the elements and the fonts will be embedded virtually.
Also, just a side information, content generated using CSS `content` property is `inline` by default, also this is rendered inside the element and not outside..
Problem
In some template I see that an arrow that created with CSS. something like this: ``` div:after{ content:"\f107"; } ``` this code display an arrow like this : what is this code? where I can find more codes?