通过设置div的float属性,我们可以很方便的得到如博客园或google主页一样的主菜单。
首先定义两个div来放置菜单,右边菜单放在前面:
1<div id="rightmenu">
2<a herf="*">登录</a> ·
3<a herf="*">注册</a>
4</div>
5
6<div id="leftmenu">
7<a herf="*">社区</a> |
8<a herf="*">新闻</a> |
9<a herf="*">招聘</a> |
10<a herf="*">闪存</a> |
11<a herf="*">网摘</a> |
12<a herf="*">Java博客</a>
13</div>
2<a herf="*">登录</a> ·
3<a herf="*">注册</a>
4</div>
5
6<div id="leftmenu">
7<a herf="*">社区</a> |
8<a herf="*">新闻</a> |
9<a herf="*">招聘</a> |
10<a herf="*">闪存</a> |
11<a herf="*">网摘</a> |
12<a herf="*">Java博客</a>
13</div>
定义CSS:
#rightmenu
{
height: 23px;
float: right;
}
#leftmenu
{
定义需要的格式
}
{
height: 23px;
float: right;
}
#leftmenu
{
定义需要的格式
}
这样实现应该是最简单的。 最关键的两点是:右边菜单的div在前,设置右边菜单向右浮动。