Join James Williamson for an in-depth discussion in this video Styling image links, part of CSS: Styling Navigation.
Occasionally, you are going to need an image that's also a clickable link.…Although most link styling considerations also apply to images as well, there are a…couple of things that you are going to want to be aware of as you're styling image links.…So to show off some of those things, I'm going to work on the image.htm file that you can…find in the 02_05 folder.…I have got that opened up currently in a browser, so you can sort of see what this page is all about.…We have a larger image up top that is a clickable link, and then we have some thumbnails down…here in the bottom that are also all individually clickable.…Now, you can see that this browser--which is Opera-- doesn't really have any default image link styling.…
So, when I make an image also a link by wrapping it an anchor element, there really isn't any default styling.…The only indication I get is the little hand that shows up, the cursor changes to let me…know that it's clickable.…In older browsers, you would often see sort of a default blue border show up on the image…
- Organizing menus with lists
- Creating block-level links
- Styling links, link states, and image links
- Defining link dimensions
- Controlling link spacing in a menu
- Creating rollovers
- Clearing floats
- Indicating current pages
- Controlling cursor states
- Building dropdown menus
- Creating CSS-only buttons
Skill Level Beginner
1. Structuring Navigation
2. Link Styling Basics
3. Creating a Vertical Menu
4. Creating Horizontal Menus
5. Dropdown Menus
6. Enhancing Navigation with CSS
Additional resources6m 29s
- Mark as unwatched
- Mark all as unwatched
Are you sure you want to mark all the videos in this course as unwatched?
Take notes with your new membership!
Type in the entry box, then click Enter to save your note.
1:30Press on any video thumbnail to jump immediately to the timecode shown.