Update text color when mouse hover

  
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>*KHAKI*</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<style rel="stylesheet" type="text/css">

.menu ul li {
  line-height: 1.8em;
  margin: 0 10px 0 0;
  padding: 0;
  list-style-type: square;
  color: #BA3F2F;
  background: inherit;
}

.menu ul li a {
  color: #BA3F2F;
  background: inherit;
}

.menu ul li a:hover {
  color: #7ABA2E;
  background: inherit;
}


</style>

</head>
<body>

  <div class="menu">
    <ul>
      <li><a href="">A</a></li>
      <li><a href="">B</a></li>
      <li><a href="">C</a> </li>
      <li><a href="">E</a></li>
      <li><a href="">F</a></li>
      <li><a href="">G </a> </li>
    </ul>
  </div>
</body>
</html>

Related examples in the same category

1.	Using Whitespace in CSS
2.	Cascaded
3.	css box model
4.	HTML and CSS coding for inline-block elements
5.	CSS Text Properties Example
6.	Zero page gutter
7.	Inline HTML elements include markup for explicit semantic purposes:
8.	CSS can be used to control the presentation of an XHTML document
9.	Box Model Demonstration
10.	Width and height
11.	Default Styles
12.	horizontally stretching content
13.	stretching content
14.	Box model properties are always specified in order clockwise.
15.	vertically stretching content
16.	Whitespace and Chunking
17.	Multiple Columns

Update text color when mouse hover : CSS Basics « Style Basics « HTML / CSS

Related examples in the same category