令人郁闷的 DOCTYPE

最近在尝试一些基于 web standard 的开发。碰到了 DOCTYPE 的问题。
翻阅了 w3c 的这个列表网页: http://www.w3.org/QA/2002/04/valid-dtd-list.html
知道在 html4.01 下 DOCTYPE 有三种。分别是 transitional(过渡时期的), strict(严格的),和 frameset(用于框架网页的). 具体如下:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"
   " http://www.w3.org/TR/html4/strict.dtd">
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
   " http://www.w3.org/TR/html4/loose.dtd">
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Frameset//EN"
   " http://www.w3.org/TR/html4/frameset.dtd">

但是我发现除了w3c网页上列举的这些之外,还有一种就是把 transitional 里的 loose.dtd 引用去掉。像这样:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">

这个不知道是否标准?反正我发现我的 EditPlus 自动生成的是这样的。还有查看了 http://www.blueidea.com 的就是这样的.

按照 w3c 的说法是,推荐尽量在可能的情况下使用 strict.dtd, 在需要支持一些旧的样式特性的时候,可以使用 transitional (当然这些不被推荐的样式以后是要逐步废除的)。

下面结合我的项目实际情况说一下。因为是在触摸屏里显示的网页,要求不出现滚动条。于是这个我用 body {margin: 0; overflow: hidden;} 来控制。
而另一方面,页面里我在不少地方采用了 web 标准推荐的布局方法,利用 div 之类的东西来定位。有一个很常用的, 居中。通常采用类似下面的代码来实现:

<style type="text/css">
#something {width: 200px; margin: auto;}
</style>

但是我发现这两个特性似乎不能同时被支持。于是我写了下列文档进行了测试:
< html >
< head >
< meta  http-equiv ="Content-Type"  content ="text/html;charset=gb2312" >
< title >  New Document  </ title >
< meta  name ="Generator"  content ="EditPlus" >
< meta  name ="Author"  content ="Roger Chen" >
< meta  name ="keywords"  content ="" >
< meta  name ="description"  content ="" >
< style  type ="text/css" >
body 
{overflow: hidden;}
#test 
{width: 300px; margin: auto; border: 1px solid green;}
</ style >
</ head >
< body >
a
< br > a < br >
< div  id ="test" > this is a test </ div >
a
< br > a < br > a < br > a < br > a < br > a < br > a < br > a < br > a < br > a < br > a < br > a < br > a < br > a < br > a < br > a < br > a < br > a < br > a < br > a < br > a < br > a < br > a < br > a < br > a < br > a < br > a < br > a < br > a < br > a < br > a < br > a < br >
</ body >
</ html >


测试方法:在这个文档的最前面插入上面提到的这几个 dtd.
令人郁闷的测试结果:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
-----------------------
overflow  支持。
margin: auto 不支持。

这个不写 dtd 感觉上和整个去掉这一行 DOCTYPE 的声明是一样的效果.

loose.dtd
-----------------------
overflow  不支持.
margin: auto 支持.

strict.dtd
-----------------------
overflow  不支持。
margin: auto    支持。

有没有人能告诉我怎样才能两个特性都支持的。或者如果有别的方法实现隐藏滚动条也好.谢谢。 否则我只能说 "web standard, 想要爱你真的好难" 了 

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值