设置导航菜单居中

原创于 2011-12-06 17:58:52 发布 · 977 阅读

0 ·

CC 4.0 BY-SA版权

文章标签：

#php

css 专栏收录该内容

3 篇文章

订阅专栏

<html>
<head>
<title>导航菜单居中示例</title>
<style type="text/css">
   .nav{background-color:#0f0; text-align:center;clear:both;}
   .nav ul{display:inline-block; *display:inline; zoom:1;padding:0;margin:0;}
   .nav ul li{float:left; margin:5px 10px 5px 10px;list-style-type:none;}
   .nav ul li a{display:block;font-size:14px;font-weight:blod;color:#00f;text-decoration:none;text-align:center;white-space:nowrap;}
</style>
</head>

<body>
<div class="header"></div>
<div class="nav">
    <ul>
        <li><a href="#">菜单项一</a></li>
        <li><a href="#">菜单项二</a></li>
        <li><a href="#">菜单项三</a></li>
        <li><a href="#">菜单项四</a></li>
    </ul>
</div>
<div class="main"></div>
<div class="footer"></div>
</body>
</html>