css yi css bölümüne Htmli ise header (üst) bölümde bi yerlere ekleyin. <body> altinda olacak html kodumuz.
Imajlar
http://www.dynamicdrive.com/cssexamples ... romebg.gif
http://www.dynamicdrive.com/cssexamples ... omebg2.gif
css kodlari
[syntax="css"]<!-- Source: Dynamic Drive CSS Library -->
<!-- URL: http://www.dynamicdrive.com/style/ -->
<style type="text/css">
#chromemenu{
width: 99%;
font-weight: bold;
font-size: 90%;
}
#chromemenu:after{ /*Add margin between menu and rest of content in Firefox*/
content: ".";
display: block;
height: 0;
clear: both;
visibility: hidden;
}
#chromemenu ul{
border: 1px solid #BBB;
width: 100%;
background: url(media/chromebg.gif) center center repeat-x;
padding: 5px 0;
margin: 0;
text-align: left; /*set value to "right" for example to align menu to the left of page*/
}
#chromemenu ul li{
display: inline;
}
#chromemenu ul li a{
color: #494949;
padding: 5px;
margin: 0;
text-decoration: none;
border-right: 1px solid #DADADA;
}
#chromemenu ul li a:hover{
background: url(media/chromebg2.gif) center center repeat-x;
}
</style>[/syntax]
<body> altina eklenecek kodlar
[syntax="html"]<div id="chromemenu">
<ul>
<li><a href="http://www.dynamicdrive.com/">Dynamic Drive</a></li>
<li><a href="http://www.dynamicdrive.com/style/">CSS Library</a></li>
<li><a href="http://www.cssdrive.com/">CSS Drive</a></li>
<li><a href="http://tools.dynamicdrive.com/imageoptimizer/">Gif Optimizer</a></li>
<li><a href="http://tools.dynamicdrive.com/favicon/">Favicon Creator</a></li>
<li><a href="http://tools.dynamicdrive.com/button/">Button Maker</a></li>
</ul>
</div>
[/syntax]
