html基础_2

HTML语义化HTML标签语义化是指：通过使用包含语义的标签（如h1-h6）恰当地表达文档结构css命名的语义是指：在html标签中添加有意义的类为什么需要语义化：之后样式被移除，页面呈现出清晰的结构。盲人可以使用屏幕阅读器更好地阅读搜索引擎，从而更好地理解页面，有利于团队项目的可持续运维。简单描述一下你对HTML语义的理解明白吗？用正确的标签做正确的事。HTML语义使页面内容结构化、清晰，便于浏览器和搜索引擎解析；即使没有样式CSS，也以文档格式显示，易于阅读；搜索引擎爬虫还依靠使用HTML标签来确定每个关键字的上下文和权重，这有利于SEO；方便阅读源码的人把网站分块，方便阅读、维护和理解Doctype的作用？标准模式和兼容模式有什么区别？声明位于HTML文档的第一行，在标记之前。告诉浏览器的解析器使用什么文档标准来解析这个文档。DOCTYPE不存在或格式不正确将导致文档以兼容模式呈现。标准模式的排版和JS运行模式均以浏览器支持的最高标准运行。在兼容模式下，页面以一种宽松的向后兼容方式显示，模拟旧浏览器的行为，以防止站点无法运行HTML5为什么只需要写？HTML5不是基于SGML的，所以不需要引用DTD，但是需要doctype来规范浏览器的行为（让浏览器正常运行）而HTML4.01是基于SGML的，所以需要引用DTD来告知浏览器文档使用的文档类型内联元素是什么？什么是块级元素？什么是空（void）元素？行内元素包括：abspanimginputselectstrong（强调语气）块级元素包括：divulollidldtddh1h2h3h4...p常见空元素：

---

在页面导入样式时使用link和@import有什么区别？链接是一个XHTML标签。除了加载CSS，还可以用来定义RSS，定义rel连接属性等；而@import是CSS提供的，只能用来加载CSS。当页面加载时，链接也会同时加载。@import引用的css会等到页面加载完成后，loadingimport是CSS2.1提出的，只能被IE5及以上识别，而且link是XHTML标签，不存在兼容性问题。说说你对浏览器核心的理解？主要分为渲染引擎（布局工程师或渲染引擎）和JS引擎渲染引擎两部分：负责获取网页内容（HTML、XML、图片等）、组织信息（如添加CSS等），并计算网页的显示方式，然后输出到显示器或打印机。不同的浏览器内核对网页的语法解释不同，因此呈现的效果也不同。所有Web浏览器、电子邮件客户端和其他需要编辑和显示网络内容的应用程序都需要内核JS引擎。然后：解析并执行javascript，实现网页的动态效果。起初，渲染引擎和JS引擎并没有明确区分，后来JS引擎越来越独立，内核往往只指渲染引擎。常见的浏览器内核有哪些？Trident内核：IE、MaxThon、TT、TheWorld、360、搜狗浏览器等。【又称MSHTML】Gecko内核：Netscape6及以上、FF、MozillaSuite/SeaMonkey等Presto内核：Opera7及以上。【Opera内核原为：Presto，现为：Blink；】Webkit内核：Safari、Chrome等。【Chrome的Blink（WebKit的一个分支）】html5有哪些新特性，去掉了哪些元素？如何处理HTML5新标签的浏览器兼容性问题？如何区分HTML和HTML5？HTML5不再是SGML的子集，主要是增加了图像、位置、存储、多任务等功能DrawingcanvasvideoandaudioelementsformediaplaybackLocalofflinestoragelocalStorage长期存储数据，数据不会被浏览器关闭后丢失sessionStorage数据在浏览器关闭后自动删除语义更好的内容元素，如文章、页脚、页眉、导航、部分表单控件、日历、日期、时间、电子邮件、url、搜索新技术webworker,websocket,Geolocation删除的元素：纯粹的表现元素：basefont,big,center,font,s,strike,tt,u对可用性有负面影响的元素：frame,frameset,noframesHTML5支持新标签：IE8/IE7/IE6支持通过Thedocument.createElement方法生成的标签可以利用这个特性让这些浏览器支持HTML5新标签。浏览器支持新标签后，需要添加标签的默认样式。当然也可以直接使用成熟的框架，比如html5shim如何区分HTML5：添加DOCTYPE语句如何使用HTML5的结构元素和功能元素的离线存储？能解释一下工作原理吗？当用户未连接到互联网时，网站或应用程序可以正常访问，当用户连接到互联网时，更新用户机器上的缓存文件原理：HTML5离线存储是基于一个新创建的.),通过这个文件上的解析列表离线存储资源，这些资源会像cookies一样被存储。之后，当网络离线时，浏览器将使用离线存储的数据来显示如何使用页面：如下在页面头部添加一个manifest属性；离线状态下将离线存储资源写入cache.manifest文件，运行window.applicationCache实现需求CACHEMANIFEST#v0.11CACHE:js/app.jscss/style.cssNETWORK:resource/logo.pngFALLBACK://offline.html浏览器如何离线HTML5存储资源管理和加载呢？在线时，浏览器在html头中找到manifest属性，就会请求manifest文件。如果是第一次访问app，浏览器会根据manifest文件的内容下载相应的资源并离线存储。如果app被访问过，并且资源已经离线存储，浏览器会使用离线资源加载页面，然后浏览器会比较新的manifest文件和旧的manifest文件，如果文件没有变化，什么都不做，如果文件发生变化，文件中的资源会被重新下载并离线存储。离线时，浏览器直接使用离线存储的资源。请描述cookies、sessionStorage和localStorage的区别？Cookie是网站为了识别用户身份而存储在用户本地终端（ClientSide）上的数据（通常是加密的）。cookie数据总是携带在同源http请求中（即使不需要），在浏览器和服务器之间记录。来回传递sessionStorage和localStorage不会自动向服务器发送数据，只在本地保存存储大小：cookie数据大小不能超过4ksessionStorage，localStorage也有存储大小限制，但是比cookie大很多，可以达到5M或者较大的一段时间时间：localStorage存储的是持久化数据，关闭浏览器后数据不会丢失，除非主动删除数据。sessionStorage数据在当前浏览器窗口关闭后自动删除。设置的cookie在过期时间之前一直有效，即使关闭了窗口或浏览器。iframe会屏蔽主页面的Onload事件。搜索引擎的检索程序无法解释这种页面，不利于SEOiframe和主页面共享连接池，而且浏览器对同域的连接有限制，所以会影响页面的并行加载.在使用iframe之前需要考虑这两个缺点。如果需要使用iframe，最好通过javascript动态的给iframe添加src属性值，这样可以避免以上两个问题。标签的作用是什么？它是如何使用的？label标签用于定义表单控件之间的关系。当用户选择标签时，浏览器会自动将焦点转到与标签相关的表单控件上。HTML5表单如何关闭自动完成功能？为您不想提示的表单或输入设置autocomplete=off。如何实现浏览器中多个标签页之间的通信？（阿里）WebSocket和SharedWorker也可以调用localstorge、cookies等本地存储方式。webSocket如何兼容低级浏览器？（阿里）AdobeFlashSocket，ActiveXHTMLFile（IE），基于multipart编码发送XHR，基于长轮询的XHR页面可见性（PageVisibilityAPI）。通过visibilityState的值检测页面当前是否可见，打开页面的时间等；当页面切换到其他后台进程时，如何自动暂停播放音乐或视频，实现页面圆形可点击区域？map+area或者svgborder-radius的纯js实现，需要点不在圆上，算法简单，获取鼠标坐标等绘制1px高的线不使用边框，标准模式和怪异模式均可使用不同浏览器保持一致效果