美文网首页
Html 知识点

Html 知识点

作者: peterMenghuan | 来源:发表于2016-11-10 13:49 被阅读0次

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

    相关文章

      网友评论

          本文标题:Html 知识点

          本文链接:https://www.haomeiwen.com/subject/pwtxpttx.html