CSS Menu
Style 2
Source Code
<div id = "style2">
<h1>My Site:</h1>
<ul>
<li><a href ="#">Home</a></li>
<li><a href ="#">About</a></li>
<li><a href ="#">Contact</a></li>
</ul>
<ul>
<li><a href ="#">Home</a></li>
<li><a href ="#">About</a></li>
<li><a href ="#">Contact</a></li>
</ul>
</div>
<div class = "content_box2">
Style 2 Content Box
</div>
CSS for #style2
#style2 {
font-family: Arial;
}
font-family: Arial;
}
CSS for H1
#style2 h1 {
font-size: 16px;
font-weight: bold;
background-color: #FF6600;
width: 120px;
padding: 5px;
float: left;
border-top: 1px solid #FF6600;
border-right: 1px solid #BB4A00;
border-bottom: 1px solid #FF6600;
border-left: 1px solid #FF6600;
margin: 10px 0px 0px 0px;
font-weight: bold;
background-color: #FF6600;
width: 120px;
padding: 5px;
float: left;
border-top: 1px solid #FF6600;
border-right: 1px solid #BB4A00;
border-bottom: 1px solid #FF6600;
border-left: 1px solid #FF6600;
margin: 10px 0px 0px 0px;
}
CSS for UL
#style2 ul {
margin: 0px;
padding: 0px;
list-style: none;
float: left;
clear: left;
padding: 0px;
list-style: none;
float: left;
clear: left;
}
CSS for LI
#style2 li {
width: 130px;
font-size: 14px;
font-weight: bold;
background-color: #FF9900;
border-right: 1px solid #DF5900;
border-bottom: 1px solid #FF6600;
border-left: 1px solid #FF6600;
font-size: 14px;
font-weight: bold;
background-color: #FF9900;
border-right: 1px solid #DF5900;
border-bottom: 1px solid #FF6600;
border-left: 1px solid #FF6600;
}
CSS for link
#style2 li a {
width: 120px;
color: #FFFFFF;
text-decoration: none;
display: block;
padding: 5px;
color: #FFFFFF;
text-decoration: none;
display: block;
padding: 5px;
}
CSS for visited link
#style1 li a:visited {
color: #FFFFFF;
text-decoration: none;
text-decoration: none;
}
CSS for hover link
#style2 li a:hover {
color: #000000;
text-decoration: none;
background-color: #FFCC33;
text-decoration: none;
background-color: #FFCC33;
}
CSS for content box
.content_box2 {
width: 586px;
font-family: Arial;
font-size: 11px;
background-color: #FFFF91;
border: 1px solid #FF6600;
padding: 15px;
float: left;
font-family: Arial;
font-size: 11px;
background-color: #FFFF91;
border: 1px solid #FF6600;
padding: 15px;
float: left;
}
