Alert icon
We're changing our privacy policy. This stuff matters.  Learn more  Dismiss

Work with CSS Sprites (background images with :hover)

Loading...

Sign in or sign up now!
Alert icon
Upgrade to the latest Flash Player for improved playback performance. Upgrade now or more info.
1,486
Loading...
Alert icon
Sign in or sign up now!
Alert icon

Uploaded by on Mar 28, 2011

For quite a while we've been able to work with CSS sprites - one image with a bunch of icons/logos instead of a bunch of separate images. We use that one image as a background image and just reposition it to show what we want in the background of something. In this tip video, I'll show you how to make a sprite image, use it as a background in several list items (you can use it for anything), then show you how to apply the :hover psuedo-class to make it change position when the cursor is hovered over the list item! Very cool stuff.

Category:

Education

Tags:

License:

Standard YouTube License

  • likes, 0 dislikes

Link to this comment:

Share to:

Uploader Comments (askbrianwood)

  • haha just a challenge, and I think it builds character...

  • @m4712ix Yes it does, indeed :)

  • I'd like to challenge you to do this in a cms not using dreamweaver :-)

  • @m4712ix I use these all the time in WordPress—a little know CMS :)

see all

All Comments (6)

Sign In or Sign Up now to post a comment!
  • great tut! thanks!

  • nice tip thanks :)

Loading...

Alert icon
0 / 00Unsaved Playlist Return to active list
    1. Your queue is empty. Add videos to your queue using this button:
      or sign in to load a different list.
    Loading...Loading...Saving...
    • Clear all videos from this list
    • Learn more