Skip to content

Instantly share code, notes, and snippets.

@jimjeffers
Created November 4, 2009 08:36
Show Gist options
  • Save jimjeffers/225898 to your computer and use it in GitHub Desktop.
Save jimjeffers/225898 to your computer and use it in GitHub Desktop.
Basic CSS Hover Example
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en">
<head>
<meta http-equiv="Content-type" content="text/html; charset=utf-8">
<title>This is a page SUCKA!</title>
<style type="text/css" media="screen">
ul#primary_navigation {
display: block;
overflow: auto;
}
ul#primary_navigation li {
background: #fcc;
display: block;
float: left;
padding: 10px;
}
ul#primary_navigation li:hover {
background: #300;
}
ul#primary_navigation li h3 a {
color: #000;
}
ul#primary_navigation li:hover h3 {
font-size: 1.25em;
}
ul#primary_navigation li:hover h3 a {
color: #fff;
}
</style>
</head>
<body>
<!-- This is to help out my friend Adam. Yeah... he's a noob. -->
<ul id="primary_navigation">
<li>
<h3><a href="#">Something</a></h3>
</li>
<li>
<h3><a href="#">Something Else</a></h3>
</li>
</ul>
</body>
</html>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment