同时使用CSS中的float:left来控制li靠左浮动即可实现横向菜单
注意UL或UL的父级容器宽度必须大于所有li宽度的和
例如<style>ul {padding:0margin:0list-style:nonewidth:600pxheight:50pxline-height:50pxtext-align:center}ul li {width:100pxheight:50pxfloat:left}<style><ul><li>菜单项目1</li><li>菜单项目2</li><li>菜单项目3</li><li>菜单项目4</li><li>菜单项目5</li><li>菜单项目6</li><ul>
实际上细心的朋友会发现,这个顶部的工具条实则是一个平铺的背景图像,CSS起到固定背景的作用,也算是一种独特的实现方法。顶部拖动无闪烁菜单栏
*
{
margin:
0px
padding:
0px
}
body
{
background-image:
url()
background-attachment:
fixed
}
#topNavWrapper
{
width:
980px
text-align:
left
height:
31px
margin:
0px
auto
z-index:100
_position:
relative
_top:0px
}
#topNav
{
width:
980px
float:
left
display:
block
z-index:
100
overflow:
visible
position:
fixed
top:
0px
/*
position
fixed
for
IE6
*/
_position:
absolute
_top:
expression(documentElement.scrollTop
+
"px")
background-image:
url(/upload/2010-3/20100303232637297.gif)
background-repeat:
no-repeat
background-position:
right
height:
31px
}
脚本之家
[Ctrl+A
全选
注:如需引入外部Js需刷新才能执行]