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 过期时间之前一直有效, 即使窗口或者浏览器关闭