doctype、input与盒模型的一些问题

doctype如果不加,或者不起作用,使用 alert(document.compatMode)出来的是BackCompat,意思是标准兼容模式关闭。

目前已经对input的盒模型有影响,对div和table都有影响。影响主要是css的height、width。正常的盒模型的height只是内容的的高度,不包括padding和border的值,可是在BackCompat下,input的height包括padding 和border,所有浏览器下都实验过全都有。

具体参考http://hi.baidu.com/danghj/blog/item/8d1e68cf52a99a22f8dc61d4.html 

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

这句话,如果前面引入了css等其他的,所有浏览器下就不起作用,就是BackCompat模式。

ie6下,前面 有句注释就不起作用,其他浏览器下有注释起作用。ie6下不用doctype,原因是会引起其他问题。我和同事发现的问题是,弹框的遮罩效果在ie6下 不会马上出来。

input框在doctype模式下,字体不能引入全局的字体,在firefox下就是SimSun,即宋体,ie下的字体是好像是英文的字体,导致2个字体的宽度不一致。

IE下input类型为text和password的长度不一致的原因是源于字体,password默认是英文字体,而text默认为定义的字体或者中文字体(我想这是在中文系统浏览器环境下的原因),从而出现了长度不同的现象。有两种方法可以解决:

(1)为input设置font-family英文字体:

000010000200003input{    font-family:'Verdana';}

原文地址:https://www.cnblogs.com/danghuijian/p/4400073.html