在新文档类型定义模型 loose.dtd 和 xhtml1-transitional.dtd 下 CSS 定义无效的解决办法 
2008/6/14 10:35:20
阅读全文(2552) | 回复(0) | 编辑 | 精华
在 WEB 页面中，经常会忽略文档类型定义模型的定义，因为多数人会使用专门的 WEB 编辑器，而文档类型定义模型是编辑器自动添加上去的。所以，有页面编辑过程中，往往忽略了文档类型定义模型 loose.dtd 和 xhtml1-transitional.dtd 对代码特别是CSS的影响。 这几天，我一直在写 XML+XSL 方式页面，但使用 Firefox 浏览，无法显示 BODY 的背景色。背景色是这样定义的： firefox.xml<?xml version="1.0" encoding="gb2312"?><?xml-stylesheet type="text/xsl" href="firefox.xsl" ?><root/> firefox.xsl<?xml version="1.0" encoding="gb2312"?><xsl:stylesheet version="1.0" xmlns:xsl="http://www.w3.org/1999/XSL/Transform"><xsl:output method="html" indent="yes"/><xsl:output doctype-public="-//W3C//DTD XHTML 1.0 Transitional//EN"/><xsl:output doctype-system="http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"/> <xsl:template match="/"><html xmlns="http://www.w3.org/1999/xhtml" lang="gb2312"> <head> <meta http-equiv="Content-Type" content="text/html; charset=gb2312" /> <style>body {background:#785c36}</style> </head> <body> XML+XSL方式下，Firefox下怎么看不到body {background:#785c36}的背景色 </body></html></xsl:template> </xsl:stylesheet> IE 下正常，但在 Firefox 下怎么都看不到 BODY 的背景色。网上常见类似问题，但多是 DIV 使用 CSS 的 float 引起 DIV 背景色无法显示。我的问题可是 BODY 的问题，应该不存在 float 的影响吧。为解决这个问题，焦头烂额了几天，今天终于有了突破。 原因就是新的文档类型定义模型使用 html 元素作为容器，而不是 body。 想到这里，在 CSS 的 body 项中加入了 html 元素，问题终于得到圆满解决。具体如下： html,body {background:#785c36} 在解决这个问题的过程中，偶而搜索发现，新文档类型定义模型 loose.dtd 和 xhtml1-transitional.dtd 同样到了影响 javascript 的应用。比如document.body.scrollHeight返回0。 解决方法就是： var nHeight = document.documentElement?document.documentElement.scrollHeight:document.body.scrollHeight
Posted by Qr on 2008/6/14 10:35:20
| 发表评论： |