rokaye

  博客园 :: 首页 :: 新随笔 :: 联系 :: 订阅 :: 管理 ::

CSS Library: Horizontal CSS Menus: Here

<style type="text/css">

#modernbricksmenu
{
padding
: 0;
width
: 100%;
background
: transparent;
voice-family
: "\"}\"";
voice-family: inherit;
}

#modernbricksmenu ul
{
font
: bold 11px Arial;
margin
:0;
margin-left
: 40px; /*margin between first menu item and left browser edge*/
padding
: 0;
list-style
: none;
}

#modernbricksmenu li
{
display
: inline;
margin
: 0 2px 0 0;
padding
: 0;
text-transform
:uppercase;
}

#modernbricksmenu a
{
float
: left;
display
: block;
color
: white;
margin
: 0 1px 0 0; /*Margin between each menu item*/
padding
: 5px 10px;
text-decoration
: none;
letter-spacing
: 1px;
background-color
: black; /*Default menu color*/
border-bottom
: 1px solid white;
}

#modernbricksmenu a:hover
{
background-color
: gray; /*Menu hover bgcolor*/
}

#modernbricksmenu #current a
{ /*currently selected tab*/
background-color
: #D25A0B; /*Brown color theme*/ 
border-color
: #D25A0B; /*Brown color theme*/ 
}

#modernbricksmenuline
{
clear
: both;
padding
: 0;
width
: 100%;
height
: 5px;
line-height
: 5px;
background
: #D25A0B; /*Brown color theme*/ 
}

#myform
{ /*CSS for sample search box. Remove if desired */
float
: right;
margin
: 0;
padding
: 0;
}

#myform .textinput
{
width
: 190px;
border
: 1px solid gray;
}

#myform .submit
{
font
: bold 11px Verdana;
height
: 22px;
background-color
: lightyellow;
}

</style>

<
div id="modernbricksmenu">
<ul>

<li style="margin-left: 1px"><href="http://www.dynamicdrive.com" title="Home">Home</a></li>
<li><href="http://www.dynamicdrive.com/new.htm" title="New">New</a></li>
<li id="current"><href="http://www.dynamicdrive.com/revised.htm" title="Revised">Revised</a></li>
<li><href="http://tools.dynamicdrive.com" title="Tools">Tools</a></li>    
<li><href="http://www.dynamicdrive.com/forums/" title="DHTML Forums">Forums</a></li>    
</ul>
<form id="myform">
<input type="text" class="textinput" /> <input class="submit" type="submit" value="Find" />
</form>
</div>

<div id="modernbricksmenuline">&nbsp;</div>
posted on 2007-06-03 00:52  rokaye  阅读(71)  评论(0)    收藏  举报