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

CSS控制所有浏览器水平居中和控制链接不换行的效果

CSS部分

/*页尾开始*/
#footer{
 clear:both;
 height:auto;
 background:rgb(38,88,87);
}
#footer *{
 color:rgb(217,230,210);
 text-align:center;
}
#footer .bottom{
 height:auto;
 text-align:center;
}
.link-ml{
 text-align:center;
}
.link-ml,.link-m1 ul{
 width:900px;
 height:auto;
}
.link-m1 ul li{
 float:left;
 padding-right:5px;
 white-space:nowrap;
}
.link-ml ul li a{
  white-space:nowrap;
}
#footer .bottom ul{
 padding-top:10px;
}
#footer .bottom ul li{
 display:inline;
}
#footer .bottom p{
 margin-bottom:-5px;
}
.bottom_bottom{
 clear:left;
}
/*页尾结尾*/

 

 

index.html中:

<div id="footer">
    <div class="bottom">
     <div>
      <ul>
       <li><a href="#">关于我们</a></li>&nbsp;|
       <li><a href="#">医院位置</a></li>&nbsp;|
       <li><a href="#">版权声明</a></li>&nbsp;|
       <li><a href="#">法律声明</a></li>&nbsp;|
       <li><a href="#">联系我们</a></li>
      </ul>
     </div>
     <br/>
     <div class="link-m1">
       <center>

                     <!---控制火狐中水平居中-->
        <ul style="margin:0 auto; margin-top:-20px; margin-bottom:10px;">
         <li><a href="#">友情连接</a></li>
         <li><a href="#">河南中医学院第一附属医院</a></li>
         <li><a href="#">河南中医学院第二附属医院</a></li>
         <li><a href="#">大河健康网</a></li>
         <li><a href="#">大河健康网</a></li>
         <li><a href="#">友情连接</a></li>
         <li><a href="#">河南中医学院第一附属医院111</a></li>
         <li><a href="#">河南中医学院第二附属医院</a></li>
         <li><a href="#">大河健康网</a></li>
         <li><a href="#">大河健康网</a></li>
         <li><a href="#">友情连接</a></li>
         <li><a href="#">河南中医学院第一附属医院</a></li>
      &n