Hello!
I want to add some icons on my .html work. i tried to do like this, for example: <span class="icon-home"></span> (but nothing show)
Anyone can help me please?
Thanks in advance!
Elvi 0 Newbie Poster
Recommended Answers
Jump to Postthe html markup, <span class="icon-home">, doesnt nothing on its own to produce an icon (image). You would need to apply a style to the span.icon-home selector.
For example...here is one way to display an image for the span element with a class of "icon-home"
span.icon-home { background: …
All 2 Replies
JorgeM 958 Problem Solver Team Colleague Featured Poster
the html markup, <span class="icon-home">, doesnt nothing on its own to produce an icon (image). You would need to apply a style to the span.icon-home selector.
For example...here is one way to display an image for the span element with a class of "icon-home"
span.icon-home {
background: url(/images/home.png) no-repeat;
background-size: 16px 16px;
width: 16px;
height: 16px;
display:block;
}
Elvi commented: thanks! +0
mattster 195 Practically a Master Poster Featured Poster
Dont forget to take a look at the font awesome library!
To use it, shove this in your <head> section:
<link rel="stylesheet" href="http://maxcdn.bootstrapcdn.com/font-awesome/4.3.0/css/font-awesome.min.css">
Then do this wherever you want to use an icon:
<!-- Instead of this -->
<span class="icon-home"></span>
<!-- Use this -->
<i class='fa fa-home'></i>
Then you can chage the colour of the icon so its the same as your text etc., loads of tutorials online and great to play around with. See here.
Elvi commented: THANK U SO MUCH! +0
Be a part of the DaniWeb community
We're a friendly, industry-focused community of developers, IT pros, digital marketers, and technology enthusiasts meeting, networking, learning, and sharing knowledge.