日期:2014-05-17  浏览次数:20864 次

怎么让层居中
在网上下了一个导航栏的代码,
导航栏文字是居左,影响了视觉效果,
我想把导航栏的文字居中,
麻烦指点一下,谢谢了

HTML code
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<title>大气的黑色CSS首页导航菜单演示  by www.mycodes.net</title>
<link href="images/style.css" type="text/css" rel="stylesheet"/>
<script type="text/javascript">
    function qiehuan(num){
        for(var id = 0;id<=7;id++)
        {
            if(id==num)
            {
                document.getElementById("qh_con"+id).style.display="block";
                document.getElementById("mynav"+id).className="nav_on";
            }
            else
            {
                document.getElementById("qh_con"+id).style.display="none";
                document.getElementById("mynav"+id).className="";
            }
        }
    }


</script>
</head>

<body style="text-align:center">
<div id=menu_out>
        <div id=menu_in>
            <div id=menu>
                <UL id=nav>
                    <li><A class=nav_on id=mynav0 onmouseover=javascript:qiehuan(0) href="http://www.mycodes.net/"><SPAN>网站首页</SPAN></A></li>
                    <li><a href="http://www.mycodes.net/" onmouseover="javascript:qiehuan(1)" id="mynav1" class="nav_off"><span>网站模板</span></a></li>
                    <li><a href="http://www.mycodes.net/" onmouseover="javascript:qiehuan(2)" id="mynav2" class="nav_off"><span>后台模板</span></a></li>
                    <li><a href="http://www.mycodes.net/" onmouseover="javascript:qiehuan(3)" id="mynav3" class="nav_off"><span>CSS菜单</span></a></li>
                    
                </UL>
                <div id=menu_con>
                    <div id=qh_con0 style="DISPLAY: block"></div> 
                    <div id=qh_con1 style="DISPLAY: none"></div> 
                    <div id=qh_con2 style="DISPLAY: none"></div> 
                    <div id=qh_con3 style="DISPLAY: none"></div> 
                    <div id=qh_con4 style="DISPLAY: none"></div> 
                    <div id=qh_con5 style="DISPLAY: none"></div> 
                    <div id=qh_con6 style="DISPLAY: none"></div> 
                    <div id=qh_con7 style="DISPLAY: none"></div>
                </div>
            </div>
        </div>
    </div>    

</body>
</html>


------解决方案--------------------
我没怎么弄懂你的意思呢~~~你是想怎么居中哟?

文字在li里是居中的啊~~~

你是要整个导航在页面中居中吗?那要设置最外层那个divr的宽度,然后margin:0 auto;就行了呀~~

------解决方案--------------------
.nav li{width:100px;float:left; height:38px; line-height:38px;text-align:center; display:inline;}