HTML相关问题1

1、doctype(文档类型)的作用是什么? 

 

 doctype是DocumentType的简称即文档类型,doctype声明位于文档中最前面的位置,处于标签之前,告知浏览器使用的是哪种规范。

2、你知道多少种文档类型?

 

   常见的文档类型有 Strict、Transitional 以及 Frameset 三种。

 

3、文档为什么要分类型?

 

   如果文档不分类型,各浏览器就会形成多种写法,假如IE用<title>标签作为标题、火狐浏览器用<caption>标签作为标题,而另一种浏览器可能采用<mytitle>,这对于开发者和用户来说简直是灾难。W3C(万维网联盟World Wide Web Consortium)制作了对所有方面都平衡的分歧解决方案,并且各浏览器没有异议,于是用<!doctype>(注意:作为一个特殊的标签,它是不需要闭合的)标签来引入W3C的dtd文件,以达到规范页面的效果。这为浏览器的文档标准的统一以及开发人员和用户带了了便利。而html5不是基于SGML实现的,因此html不需要引入DTD,所以html5可以简单的声明一下<!doctype html>。

 

4、如果不声明doctype?

 

   不写doctype,浏览器会进入quirks mode (混杂模式)。即,如果不声明doctype,浏览器不引入w3c的标准,那么早期的浏览器会按照自己的解析方式渲染页面。浏览器采用自身方式解析页面的行为称为"quirks mode(混杂模式也称怪异模式)";采用w3c方式解析就是"strict mode(标准模式)"。 如果完全采用strictmode就不会出任何的差错,但这样会降低程序的容错率,加重开发人员的难度,因此在standards mode 里面分出来 Almost Standards Mode(接近标准模式)。如图所示:

 

5、如何判断浏览使用哪种方式解析css?

 

    没有doctype声明的采用quirks mode解析,对于有doctype的大多数采用standard mord。特殊情况:对于那些浏览器不能识别的doctype ,浏览器采用quirks mode;没有声明DTD或者html版本声明低于4.0采用quirks mode,其他使用standard mode;ie6中,如果在doctype声明前有一个xml声明(比如:<?xml version="1.0" encoding="iso-8859-1"?>),则采用quirks mode解析。

 

6、浏览器标准模式和怪异模式之间的区别是什么?


标准模式:浏览器根据规范呈现页面

混杂模式(怪异模式):页面以一种比较宽松的兼容方式显示。

他们最大的不同是对盒模型的解析。

如:在strict mode中 :width是内容宽度 ,也就是说,元素真正的宽度 = margin-left + border-left-width + padding-left + width + padding-right + border-right- width +  margin-right;

  在quirks mode中 :width则是元素的实际宽度 ,内容宽度 = width - (margin-left + margin-right + padding-left + padding-right + border-left-width +  border-right-width)

 

7、js如何判断浏览器正在以何种方式解析?

 

使用 document.compatMode来判断浏览器的解析方式。

例如:

function getMode{
    var _cm = docoment.compatMode;
    if(_cm == 'CSS1Compat'){
         return "strict"
    } 
    if(_cm == 'BackCompat' ){
         return  'quirks'
    } 
}

 

8、何时使用document.body 何时使用document.documentElement?

      在quirks 模式下,document.documentElement无法正确取到clietHeight  scrollHeight等值,比如clietHeight=0,此时计算页面高度的时候需要用document.body来代替document.documentElement.

      document.body是DOM中Document对象里的body节点, document.documentElement是文档对象根节点(html)的引用。 document.body.scrollHeight是body元素的滚动高度,document.documentElement.scrollHeight为页面的滚动高度。

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

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值