面经

HTML

1.Doctype作用,标准模式与兼容模式的区别

   声明位于html文档中的第一行,处于<>html标签之前。告知浏览器用什么文档标准来解析这个文档,DOCTYPE不存在或者格式不正常 会导致文档以兼容模式呈现。

    保准模式的排版和js运作模式都是以浏览器支持的最高标准运行。在兼容模式中,页面以宽松的向后兼容的方式显示,模拟老式浏览器的行为以防站点无法工作。

2.html5 为什么只要写

    html5不基于SGML,因此不需要对DTD进行引导,但是需要doctype来规范浏览器的行为。

    sgml是标准通用标记语言,html是超文本标记语言 xml是可扩展标记语言  xhtml和html差不多比html严格,不如标签都用小写,都得有闭合标签等。

3,行内元素有哪些,块级元素有哪些,空元素有哪些

    首先,css规范规定,每个元素都用display属性,确定该元素的类型,每个元素都用默认的display的值,比如div的默认值为block 则为块级,span的默认值为inline则为行内元素

(1)行内:span,a,b,i,img,input,select,strong

(2)块级:div ol ul li dl dt dd h1 h2 h3 p

(3)常见空元素

   


4.页面导入样式的时候,使用link和import有什么区别

    (1)link属于xhtml标签,除了加载css外,还能用来定义rss,定义rel链接属性等作用;而import是css提供的,只能用于加载css

    (2)页面加载时link会同时被加载,import是页面加载完成时在加载

    (3)import是css标签有兼容性(ie5以上被识别) link没有兼容性

5.浏览器内核的理解,以及常见内核

    浏览器内核分为:渲染引擎和js引擎,js引擎越来越独立,现在内核倾向于渲染引擎

    Trident : ie

    Gecko : FF

    Presto : opera7

    webkit:sifari,chrom

6.Html5有哪些新特性,移除了哪些,如何处理html5新标签的浏览器兼容问题,如何区分html和html5

    html5现在已经不是SGML的子集,主要是关于图像,位置,存储,多任务等功能的增加

            绘画:canvas;媒介回放的:video,audio元素;本地离线存贮;长期存储数据:localstroage;关闭浏览器自动删除:sessionstroge ;语义化元素:article,footer,header,nav,section; 表单控件:data time email url search ;新的技术:webworker,websocket,Geolocation

    移除的元素:纯表现的元素:basefont,big,center,font,s,tt;;对于可用性产生负面影          响的:frame

    怎么让浏览器支持新特性: IE6/7/8支持通过document.createElement方法产生的标签,可以利用这一点让浏览器支持html5新标签,浏览器支持新标签后,还需要添加标签默认的样式,

    当然可有成熟的框架: html5shim 

 区分是不是html5标签: doctype声明/新增的结构元素,功能元素 src="http://html5shim.googlecode.com/svn/trunk/html5.js"

7.语义化的理解

    正确的标签做正确的是,结构化,内容清晰,便于浏览器解析,在没有css的样式下也以一种文档格式显示,容易阅读,有利于seo,便于阅读源代码

8.css3创建三角形的原理

    把上左右三遍隐藏掉

    #demo{

        width: 0;

        height:0;

       border-width: 20px;

        border-style: solid;

        border-color:transparent transparent red transparent;

    }

9.

10. 为什么要清除浮动, 清楚浮动的方式

    清除浮动是为了清除使用浮动元素产生的影响,浮动的元素,高度会塌陷,而高度塌陷使我们页面后面的布局不能正常显示

    方法 1. 父级div定义height 2.父级div一起浮动 

        3.常规的使用一个class  .clearfix::before,.clearfix::after{ content: ""; display:table} .clearfix::after{ clear:both }  .clearfix{ *zoom: 1}

    4, .clearfix::atter,.clearfix::before{ content:"", visibility: hidden; display: block; height:0; clear: both}

解析原理: display:block 使生成的元素以块级元素显示,占满剩余空间; height:0 ;避免生成高度破坏原有布局的高度,visibility:hidden 使生成内容不可见,并允许可能被生成被生成内容盖住的内容可以进行点击交互,通过content:"."生成元素作为最后一个元素,至于content里边的内容是森马无所谓 因为都看不到,zoom:1 出发ie的haslayout。

11.森马是外边距合并

        外边距合并指的是,当两个垂直外边距相遇时,他们讲形成一个外边距,合并后的外边距的高度等于发生合并的外边距的高度重的较大者

12,页面的重绘以及回流(重排):页面第一次加载时一定会进行一次回流,当页面发生dom改变,增删改查,会促使页面的回流,当页面只是单纯的进行样式改变则会发生重绘,回流必定会引起重绘,重绘不一定会引起回流。

你可能感兴趣的:(面经)