六狼论坛

 找回密码
 立即注册

QQ登录

只需一步,快速开始

新浪微博账号登陆

只需一步,快速开始

搜索
查看: 173|回复: 0

DIV+CSS DIV居中布局

[复制链接]

升级  91.67%

143

主题

143

主题

143

主题

举人

Rank: 3Rank: 3

积分
475
 楼主| 发表于 2013-2-7 22:23:12 | 显示全部楼层 |阅读模式
利用DIV+CSS布局时,经常需要利用DIV居中,很多时候如果不知道怎样设置CSS,需要写大量的代码和复杂的Javascript来让DIV居中,其实利用CSS,可以轻松的设置DIV居中,而且对IE和Firefox都适用。

其实非常简单,只需要两行代码就可以了:
width:900px;margin:0px auto;

我们要给一个DIV设置它的宽度,然后设置margin的左边和右边的边缘都是自动auto. margin:0px auto

具体代码有:
DIV:
<div id="mainBody">

CSS:
#mainBody{
width:900px;
margin:0px auto;
margin-top:20px;
font-size:14px;
}

具体的代码可以参考附件。
另外在利用DIV+CSS布局时,最好写上Doctype:<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> 否则不用的浏览器,不同的浏览器版本,可能会产生不同的页面显示效果。

文章地址:http://javapub.iteye.com/blog/709361
您需要登录后才可以回帖 登录 | 立即注册 新浪微博账号登陆

本版积分规则

快速回复 返回顶部 返回列表