HTMLCSS

当前位置:首页 > HTMLCSS

css布局网页水平居中常用方法 - HTMLCSS

页面水平居中一般会令人很头疼,尤其新手。浏览器之间的不兼容也会带来很大问题。下面来说一下常见的页面水平居中办法。 以下内容参见《...

页面水平居中一般会令人很头疼,尤其新手。浏览器之间的不兼容也会带来很大问题。下面来说一下常见的页面水平居中办法。 

以下内容参见《精通CSS》。 

HTML代码: 

<body>  <div id="wrapper">  </div>  </body>  IE居中办法:  body {     text-align:center;     min-width:760px;  }  #wrapper {     width:720px;     text-align:left;  }

IE会将text-align:center 误以为让所有东西居中,而不只是文本。然后将容器的内容重新对准左边即可。 

非IE: 

#wrapper {     width:720px;     margin:0 auto;  }

如何兼容IE和非IE?如下: 

#wrapper {     width:720px;     position:relative;     left:50%;     margin-left:-360px;  }

首先将容器左边边缘定位到页面中间,然后向左移动它宽度的一半。

以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持来客网。

相关内容

文章评论

表情

共 0 条评论,查看全部
  • 这篇文章还没有收到评论,赶紧来抢沙发吧~

评论排行榜

热门标签