Slice image CSS. / Single file multiple images.

<!DOCTYPE html>
<html>
<head>
<style type=”text/css”>
#navlist{position:relative;}
#navlist li{margin:0;padding:0;list-style:none;position:absolute;top:0;}
#navlist li, #navlist a{height:44px;display:block;}
#home{left:0px;width:46px;}
#home{background:url(‘img_navsprites_hover.gif’) 0 0;}
#home a:hover{background: url(‘img_navsprites_hover.gif’) 0 -45px;}
#prev{left:63px;width:43px;}
#prev{background:url(‘img_navsprites_hover.gif’) -47px 0;}
#prev a:hover{background: url(‘img_navsprites_hover.gif’) -47px -45px;}
#next{left:129px;width:43px;}
#next{background:url(‘img_navsprites_hover.gif’) -91px 0;}
#next a:hover{background: url(‘img_navsprites_hover.gif’) -91px -45px;}
</style>
</head>
<body>
<ul id=”navlist”>
  <li id=”home”><a href=”default.asp”></a></li>
  <li id=”prev”><a href=”css_intro.asp”></a></li>
  <li id=”next”><a href=”css_syntax.asp”></a></li>
</ul>
</body>
</html>
Advertisements
Posted in Web

4 thoughts on “Slice image CSS. / Single file multiple images.

  1. I simply want to tell you that I am just beginner to weblog and honestly savored this web-site. More than likely I’m want to bookmark your blog . You amazingly have impressive article content. Thanks a lot for sharing your blog.

  2. I blog frequently and I really thank you for your information.
    This great article has really peaked my interest. I
    am going to bookmark your blog and keep checking for new information about once a week.
    I opted in for your RSS feed too.

  3. I love your blog.. very nice colors & theme. Did you design this website yourself or
    did you hire someone to do it for you? Plz respond as I’m looking to create my own blog and would like to find out where u got this from. cheers

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out / Change )

Twitter picture

You are commenting using your Twitter account. Log Out / Change )

Facebook photo

You are commenting using your Facebook account. Log Out / Change )

Google+ photo

You are commenting using your Google+ account. Log Out / Change )

Connecting to %s