html加了文档声明之后页面错乱,DOCTYPE 文档类型声明(网页爱好者必看)

DOCTYPE 文档类型声明(网页爱好者必看)

发布时间:2009-11-02 00:59:13   作者:佚名   text-message.png 我要评论

文档类型声明与不声明,将会导致你的css或js都无法正常安装要求显示。所以好多网站都声明了文档类型。这样做有什么好处大家可以看看下面的文章。

文档类型声明

在你每一个页面的顶端,你需要文档声明。是的,必须。

如果不指定文档类型,你的HTML不是合法的HTML,并且大部分浏览器会用“怪癖模式(quirks mode)”来处理页面,这意味着浏览器认为你自己也不知道究竟做什么,并且按浏览器自己的方式来处理你的代码。你可以是一个HTML大师,在地球上打遍天下无敌手,或者你的HTML可以无瑕疵,CSS可以很完美,但如果没有文档声明,或者错误的文档声明,你的网页与一个短视的,独眼的长臂猿婴儿十分艰难地堆砌起来的没两样。

XHTML 1.0 Strict(严格)的文档声明是这样的:

下面的是XHTML 1.1的文档声明,作为XHTML的最新版本,看起来更完美,但还是有一些问题,随后我们会稍微讲解

注意DOCTYPE标签必须大写和前置一个英文半角感叹号!。它是唯一一个打破规则的标签,它不需要关闭。

语言声明

即使HTTP头或者在html起始标签内设置了xml:lang属性,你也必须为文档指定一个主要语言。尽管处理一个合法的XHTML文档这不是必须的,但也是一个易用性的考虑。值是缩写的,比如en(English,英语),fr(French,法语),de(German,德语)。

声明一个主要用英语内容的文档,例子是这样的:

在声明主要语言之后,假如还需要使用其他语言,你还可以在内联中使用xml:lang属性(比如HTML Hund)。

内容类型

HTML文档的媒体类型和字体集也许要指定,可以使用HTTP头来完成,比如:

Content-Type: text/html; charset=UTF-8

HTTP头部的第一部分(如text/html)是文件MIME类型,让浏览器知道文件的媒体类型因此可以知道怎么处理。所有的文件都有MIME类型。JPEG图像是image/jpeg,CSS文件是text/csss和HTML一般使用text/html。

HTTP头部的第二部分(如UTF-8部分)是字符集。

也许设置HTTP头的最简易方法是在HTML中使用“HTTP同义(HTTP-equivalent)”的头标签,像这样:

下面是常用的文档声明,其实dreamweaver默认就是这种声明。

复制代码代码如下:

无标题文档

下面是脚本之家的补充内容。

css声明与不声明会导致页面的控制不一样。更不会符合w3c标准什么的。所以建议大家都要加上。这样才能让多浏览器兼容您的网站。

javascript的影响,会更大,导致以前写的js代码,不能正常的运行。尤其像对联广告之类的。其实一般情况注意下面这个问题,就好了

不声明的时候 一般用 document.body.scrollTop;

声明文档类型的时候用document.documentElement.scrollTop;

下面是一些参考文档

编写跨浏览器的javascript代码必备[js多浏览器兼容写法]

javascript firefox兼容ie的dom方法脚本这方便的东西太多了,大家可以多搜索一下吧。

相关文章

e40efe845a0f664ad2a2f614e7bd4206.png

这篇文章主要介绍了html父子页面iframe双向发消息的实现示例,文中通过示例代码介绍的非常详细,对大家的学习或者工作具有一定的参考学习价值,需要的朋友们下面随着小编来2020-10-12

02428f9a3a53c0dbc61aa524e045f3b8.png

这篇文章主要介绍了如何在HTML里加载摄像头,本文通过实例代码给大家介绍的非常详细,对大家的学习或工作具有一定的参考借鉴价值,需要的朋友可以参考下2020-09-29

这篇文章主要介绍了html-webpack-plugin使用,本文给大家介绍的非常详细,对大家的学习或工作具有一定的参考借鉴价值,需要的朋友可以参考下2020-09-15

fb53b03c06d6b99c2470ba5621627936.png

这篇文章主要介绍了html直接引用vue和element-ui的方法,本文通过实例代码给大家介绍的非常详细,对大家的学习或工作具有一定的参考借鉴价值,需要的朋友可以参考下2020-09-02

11c12187b7f88a98f8e187034751e1ae.png

这篇文章主要介绍了详解HTML中字体使用line-height依然不能垂直居中解决办法,文中通过示例代码介绍的非常详细,对大家的学习或者工作具有一定的参考学习价值,需要的朋友2020-08-20

7b55d6d8d4513e2aec57044733efc6d9.png

这篇文章主要介绍了前端html换肤功能的实现代码,本文给大家介绍的非常详细,对大家的学习或工作具有一定的参考借鉴价值,需要的朋友可以参考下2020-08-20

fbf8fd9af4fb0a5f134d10cbbaabdac2.png

这篇文章主要介绍了多个HTML页面共同调用一段html代码的方法,文中通过示例代码介绍的非常详细,对大家的学习或者工作具有一定的参考学习价值,需要的朋友们下面随着小编来2020-08-17

这篇文章主要介绍了HTML中图片不存在显示默认图片的方法示例,文中通过示例代码介绍的非常详细,对大家的学习或者工作具有一定的参考学习价值,需要的朋友们下面随着小编来2020-08-17

47e8b754abb2e662eb86e189d77d507f.png

这篇文章主要介绍了HTML table行距的改变方法示例,文中通过示例代码介绍的非常详细,对大家的学习或者工作具有一定的参考学习价值,需要的朋友们下面随着小编来一起学习学2020-07-31

这篇文章主要介绍了HTML Table 空白单元格补全的实现方法,文中通过示例代码介绍的非常详细,对大家的学习或者工作具有一定的参考学习价值,需要的朋友们下面随着小编来一2020-07-31

最新评论

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

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值