a[href^="mailto:"]:before { content: "\2709"; }
.phone:before { content: "\2706"; }
.important:before { content: "\27BD"; }
blockquote:before { content: "\275D"; }
blockquote:after { content: "\275E"; }
.alert:before { content: "\26A0"; }
<p>
<a href="mailto:[email protected]">
[email protected]
</a>
</p>
<p class="phone">
555-555-5555
</p>
<p class="important">
REMEMBER: drink slushies too fast.
</p>
<blockquote>
Designers tend to whisper, ad agencies tend to shout.
</blockquote>
<p class="alert">
Stranger Danger!
<p>
For the phone you can also use this:
How can i make a menu (Link) in the vertical direction (from top to bottom)
that contain the different image or icon before every link.
how can i make it with css and html
i want to use the ul and li for navigation
You can give the ul an id/class of nav (example) for styling, and you can give each li an id/class
.nav
.nav first { background: url(“”) }
.nav second
etc..
And for uncommon unicode icons, convert your code from decimal to hexadecimal. E.g, instead of using ▲ use:
content: “\25B2”;
http://www.binaryhexconverter.com/decimal-to-hex-converter
What about cross-browsering??? Do they work on old browsers? Thanx a lot!!!