本文探讨了不同DOCTYPE声明如何影响CSS布局中的元素居中问题，并提供了具体的解决方案，特别是对于使用sitemesh的情况。
1.DOCTYPE 影响 CSS 处理
当层无法运用margin:0 auto居中问题的解决!
如果无法运用<div style="margin:0 auto">....</div>来设置层居中.出现这样问题可能是没有定义hmlt的dtd,html向标准化的xml演变的过程是需要时间的,所以有三个dtd版本,我们现在用的最多的就是过渡期的dtd
这三个分别是
1,过渡型
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
2,严格型
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
3,框架型
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Frameset//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-frameset.dtd">
如果对css 2.0标准不太熟悉不要使用严格型的dtd.我们现在使用过渡期的就行了!
在网页最顶剖加上
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
我在sitemesh中使用的时候，就必须把
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
这句话，放置到decorator的布局文件里面：
<%@ page language="java" errorPage="/error.jsp" pageEncoding="UTF-8"
contentType="text/html;charset=UTF-8"%>
<%@ include file="/common/taglibs.jsp"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html>
<head>
<title><decorator:title default="特斯通" />
</title>
<%@ include file="/common/metaNew.jsp"%>
<decorator:head />
</head>
<body>
<div id="container">
<div class="header">
<%@ include file="/common/headerNew.jsp"%>
</div>
<div class="content">
<decorator:getProperty property="page.heading" />
<decorator:body />
</div>
<div id="footer">
<%@ include file="/common/footerNew.jsp"%>
</div>
<br clear="all" />
</div>
</body>
</html>
当层无法运用margin:0 auto居中问题的解决!
如果无法运用<div style="margin:0 auto">....</div>来设置层居中.出现这样问题可能是没有定义hmlt的dtd,html向标准化的xml演变的过程是需要时间的,所以有三个dtd版本,我们现在用的最多的就是过渡期的dtd
这三个分别是
1,过渡型
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
2,严格型
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
3,框架型
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Frameset//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-frameset.dtd">
如果对css 2.0标准不太熟悉不要使用严格型的dtd.我们现在使用过渡期的就行了!
在网页最顶剖加上
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
我在sitemesh中使用的时候，就必须把
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
这句话，放置到decorator的布局文件里面：
<%@ page language="java" errorPage="/error.jsp" pageEncoding="UTF-8"
contentType="text/html;charset=UTF-8"%>
<%@ include file="/common/taglibs.jsp"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html>
<head>
<title><decorator:title default="特斯通" />
</title>
<%@ include file="/common/metaNew.jsp"%>
<decorator:head />
</head>
<body>
<div id="container">
<div class="header">
<%@ include file="/common/headerNew.jsp"%>
</div>
<div class="content">
<decorator:getProperty property="page.heading" />
<decorator:body />
</div>
<div id="footer">
<%@ include file="/common/footerNew.jsp"%>
</div>
<br clear="all" />
</div>
</body>
</html>
扫一扫
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
