HTML
<ul id="navlist"> <li><a href="#">One</a></li> <li><a href="#">Two</a></li> <li><a href="#">Three</a></li> <li><a href="#">Four</a></li> <li><a href="#">Five</a></li> <li><a href="#">Six</a></li></ul>
CSS
ul#navlist {display: inline;list-style: none;}
CSS
ul#navlist li {float: left;width: 60px;height:60px;}
CSS
ul#navlist li a {width: 50px;height:50px;padding:5px;display:block;
CSS
color:#fff;text-decoration: none;font-size:7pt;font-family:arial;line-height:50px;text-align:center;
CSS
border-right:1px solid #fff;border-left:1px solid #fff;border-top: 5px solid #fff;border-bottom: 5px solid #fff;background: #003663;}
CSS
ul#navlist li a:hover { border-top: 5px solid #004a80; border-bottom: 5px solid #004a80; background:#004a80; font-size:9pt; font-weight:bold;}
HTML
<ul id="nav"> <li><a href="/">Home</a></li> <li><a href="/about/">About</a></li> <li><a href="/work/">Work</a></li> <li><a href="/clients/">Clients</a></li> <li><a href="/contact/">Contact</a></li> </ul>
CSS
#nav{ border:1px solid #ccc; border-width:1px 0; list-style:none; margin:0; padding:0; text-align:center;}#nav li{ display:inline;}#nav a{ display:inline-block; padding:10px;}
#2e2e2e #1c1c1c.
css3
HTML
<ul id="main-navigation"> <li class="first"><a href="">Home</a></li> <li><a href="">Themes</a></li> <li><a href="">Demos</a></li> <li><a href="">Blog</a></li> </ul>
CSS
#main-navigation { width: 100%; -moz-border-radius: 8px; -khtml-border-radius: 8px; -webkit-border-radius: 8px; background: -webkit-gradient(linear, left top, left bottom, from(#444444), to(#666666)); background: -moz-linear-gradient(top, #444444, #666666); filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#444444', endColorstr='#666666'); border: 1px solid #444; list-style: none; padding: 0; margin: 0; float: left; } #main-navigation li { float: left; border-right: 1px solid #777; } #main-navigation li a { font: 13px Georgia, "Times New Roman", Times, serif; letter-spacing: 1px; padding: 12px 20px; border-right: 1px solid #333; display: block; color: #fff; }
|
|
|
CSS
#main-navigation li.first a { -moz-border-radius: 8px 0 0 8px; -khtml-border-radius: 8px 0 0 8px; -webkit-border-radius: 8px 0 0 8px;}
1. .
2. 3 .
3. .
4. html-.
1. .
2. , .
1. .
2. .
3. .
4. \\ academy.
