Html 知识点

Doctype作用?标准模式和兼容模式各有什么区别

<!DOCTYPE>声明位于HTML文档中的第一行,处于<html>标签之前,告知六块蓝旗用什么文档标准解析这个文档.Doctype不存在或者格式不正确会导致浏览器以兼容模式层显.
兼容模式的排版和 JS运作模式都是以浏览器支持的最高标准执行.在兼容模式中,页面一宽松的向后兼容的方式显示,模拟老式浏览器的行为以防止站点无法工作.

Html5 为什么只需要写就行了?

HTML5 不ji于SGML, 因此不需要对DTD进行引用,但是需要DOCTYpe来规范浏览器的行为
而HTML4.01基于SGML,所以需要对DTD进行引用,才能告知浏览器文档所用的类型是什么
区分 HTML5 : DOCTYPE声明\ 新增的结构元素\ 功能元素

行内元素块级元素空元素分别有什么?

+ 行内元素:  a span  b  img input select strong 
+ 块级元素: div p h1-h6 ul ol li dt dd dl
+ 空元素: br hr img input link meta

导入样式的时候, link和@import有什么区别?

link属于XHtml标签,除了加载Css外,还可以定义Rss,定义Rel链接属性等作用; 而@import 是css提供的,只能用于加载css;
页面被加载时候,link会同时被加载,而@import引用的CSS样式需要页面被加载完之后才加载
link时XHTML标签 ,无兼容问题;而@import 是Css2.1被提出的,只有在IE5以上才被识别

对浏览器内核的理解

分为渲染引擎( layout engineer Rendering Engine) 和 JS引擎
渲染引擎: 负责取得页面的内容(HTML,XML,图片等等),整理讯息(如加入CSS等), 以及计算网页的显示方式 ,然后会输出值显示器的.浏览器内核的不同,导致对页面的语法解释不同.
JS引擎:解析和执行Javascript来实现页面的动态效果
现在JS引擎越来越独立 ,内核则倾向于只是渲染引擎.

常见的浏览器内核有哪些?

  + Trident内核：　ie Maxthon 360 搜狗
  + Gecko内核 :  火狐  Mozilla Firefox
  + Presto :  Opera  (Blink :  Opera 和 Chrome一起开发)
  + Webkit :  Safari  Chrome

HTML5的新特性

  主要是关于图像 , 位置 ,存储 ,多任务等功能的增加 
+  绘画 : canvas ;
+ 视频和音频:video和audio
+  本地的离线存储 : localStorage和sessionStorage
+ 语义化更好的标签 : article footer header nav section
+ 表单控件 : calender date  time email  url  search

可以利用 document.createElement方法产生H5的新标签,来解决浏览器的兼容问题,当然还需要添加默认的样式,所以有了html5shim;

<!--[if lt IE 9]>//条件注释
  <script> src ="http://html5shim.googlecode.com/svn/trunk/html5.js"</script>
<![endif]-->

简述一下对 HTML语义化的理解?

用正确的标签做正确的事情;
html语义化让页面的内容结构化,使结构更加清晰,便于对浏览器和搜索引擎的解析
即使在没有Css样式的情况下,让页面也是一种容易阅读的文档格式,
搜索引擎的爬虫也是根据HTML的标签来确定文档的上下文和各个关键字的权重,利于SEO;
利于开发人员更好的维护理解网站,更加人性化.

HTML5的离线储存怎么使用，工作原理能不能解释一下？

    没有与因特网连接时，可以正常访问站点或应用，在用户与因特网连接时，更新用户机器上的缓存文件。原理：HTML5的离线存储是基于一个新建的.appcache文件的缓存机制(不是存储技术)，通过这个文件上的解析清单离线存储资源，这些资源就会像cookie一样被存储了下来。之后当网络在处于离线状态下时，浏览器会通过被离线存储的数据进行页面展示。
    如何使用：
    1、页面头部像下面一样加入一个manifest的属性；
    2、在cache.manifest文件的编写离线存储的资源； CACHE     MANIFEST #v0.11 CACHE: js/app.js css/style.css NETWORK: resourse/logo.png FALLBACK: / /offline.html

    3、在离线状态时，操作window.applicationCache进行需求实现。

描述 cookies ,sessionStorage 和 localStorage 的区别

cookie 是网站为了标示用户的身份而存储在用户本地终端上的数据(通常是经过加密的),cookie数据始终在同源的http请求中携带(即使不需要 ),会在浏览器和服务器间来回传递

sessionStorage 和localStorage不会自动把数据发给服务器,仅在本地保存,需要的时候人为发送

存储大小:
cookie的数据大小不能超过4k.
sessionStorage和localStorage 虽然也有大小限制,但是比cookie大的多,可以达到5M或者更大
到期时间 :
localStorage 存储持久数据,浏览器关闭后数据也不丢失除非主动清除数据
sessionStorage 存储数据在当前窗口关闭后自动删除
cookie 设置的cookie 过期时间之前一直有效, 即使窗口或者浏览器关闭

最后编辑于：2017.12.04 08:15:00