H5+Css3面试题总结一、html5和html的区别：1、html5增加了语义标签：footer,nav,section...2.html5全面支持css33。支持本地离线存储4.新增canvas标签5.新增视频、音频标签HTML5离线存储localStorage长期存储数据，关闭浏览器后数据不会丢失；sessionStorage数据在服务器关闭时被浏览自动删除。如何区分HTML和HTML5？DOCTYPE声明新的结构元素和功能元素1232.语义标签的理解（优点）：a．当样式被移除或丢失时，页面可以显示出清晰的结构b．有利于SEO：与搜索引擎建立良好的沟通，有助于爬虫抓取更有效的信息：爬虫依靠标签来判断每个关键词的上下文和权重；C。方便其他设备（如屏幕阅读器、盲人阅读器、移动设备）以有意义的方式解析以呈现网页；d.方便团队开发维护，语义可读性更强。遵循W3C标准的团队遵循这个标准，可以减少差异化。3、浏览器内核：IE浏览器的Trident内核，Mozilla的Gecko，Chrome的Blink（WebKit的一个分支），Opera内核前身为Presto，现为Blink；谈谈你对浏览器内核的理解？主要分为两部分：渲染引擎??（layoutengineer或RenderingEngine）和JS引擎。渲染引擎：负责获取网页的内容（HTML、XML、图片等），组织信息（如添加CSS等），计算网页的显示方式，然后输出到显示器或打印机。不同的浏览器内核对网页的语法解释不同，因此呈现的效果也不同。所有Web浏览器、电子邮件客户端和其他编辑和显示Web内容的应用程序都需要内核。JS引擎：解析执行javascript，实现网页动态效果。4、前端页面的三层是什么，分别是什么？作用是什么？A。结构层：由HTML或XHTML等标记语言创建，只负责语义的表达。解决了页面“内容是什么”的问题。b.表现层：由CSS创建，解决页面“如何显示内容”的问题。C。行为层：脚本负责。修复了页面上“内容应如何对事件做出反应”的问题。5、Doctype的作用是什么？如何区分严格模式和混合模式？他们的意思是什么？声明在文档中排在第一位，在标签之前。告诉浏览器在哪种模式下呈现文档。严格模式下的排版和JS以浏览器支持的最高标准运行。在混杂模式下，页面以轻松的向后兼容方式显示。模拟旧浏览器的行为以防止网站无法正常工作。不存在或格式错误的DOCTYPE将导致文档以混杂模式呈现。6、你知道多少种Doctype文档类型？标记可以声明三种DTD类型，分别代表严格的、临时的和基于框架的HTML文档。七、HTML和XHTML——两者有什么区别a．XHTML元素必须正确嵌套。b.XHTML元素必须是封闭的。C。标记名称必须为小写字母。d.XHTML文档必须有一个根元素。8.说说输入网址回车看到网页的过程中发生了什么a．域名解析B.启动3次TCP握手c.建立TCP连接后发起http请求d．服务器响应http请求，浏览器得到html代码e。浏览器解析html代码，请求html代码f中的资源。浏览器呈现页面并将其呈现给用户9.了解网站重构、简化结构、增加可读性，同时保持网站前端的行为一致。A。使网站前端兼容现代浏览器（对于非标准CSS，如对IE6有效）b．对于移动平台优化，优化SEOc。减少代码之间的耦合，保持代码的灵活性d．压缩或组合JS、CSS、图片等前端资源。十。一个页面（大型电商网站）图片很多，加载很慢。你有什么方法来优化这些图片的加载，让用户有更好的体验。A。图片是懒加载的，滚动到相应位置后才加载图片。b.图片预加载，如果是幻灯片、相册等，会先下载当前显示图片的上一张和下一张。C。使用CSSsprite、SVGsprite、Iconfont、Base64等技术，如果图片是css图片。d.如果图片太大，可以使用经过特殊编码的图片。加载时，会先加载经过特别压缩的缩略图，以提升用户体验。十九、css的三大特性：1.继承2.堆叠3.优先级20.CSS选择器：1.标签选择器2.ID选择器3.类选择器4.相邻选择器5.子选择器6.后代选择器7.通配符selector8.属性选择器9.伪类选择器21.css中可继承的样式：Font-sizefont-familycolortext-indent不可继承的样式：borderpaddingmarginwidthheight;CSS优先级算法是如何计算的？优先、就近原则，同等权重下最接近的样式定义为准；加载样式以最后一次加载的位置为准；权重相同：内联样式表（标签内）>嵌入样式表（当前文件）>外部样式表（在外部文件中）。!important>id>class>tagimportanthasahigherprioritythaninlineby123456723、tag上的title和alt属性的区别：title：为该属性提供信息alt：图片不显示时，替换为text24.简述src和href的区别。src用于替换当前元素，href用于在当前文档和引用资源之间建立链接。src是source的缩写，指向外部资源的位置，指向的内容会嵌入到文档中当前标签的位置；当请求src资源时，它指向的资源将被下载并应用到文档中，例如js脚本、img图片和frame元素。25.css中允许文本垂直和水平重叠的两个属性是什么？垂直方向：line-height水平方向：letter-spacing那么问题来了，你知道letter-spacing有哪些妙用吗？Answer:可以用来消除inline-block元素之间的换行空格问题。26.display:none和visibility:hidden有什么区别？display：隐藏对应的元素，但不占据元素原有的空间。visibility：隐藏对应元素，占据元素原有空间。fixed：（旧IE不支持）生成绝对定位元素，相对于浏览器窗口定位。relative：生成相对定位的元素，相对于其正常位置定位。静态：默认值。没有定位，元素出现在正常流中*（顶部、底部、左侧、右侧z-index声明被忽略）。inherit指定从父元素继承位置属性的值。30.浏览器标准模式和怪癖模式有什么区别？1）严格模式下：width为内容宽度，元素的真实宽度=margin-left+border-left-width+padding-left+width+padding-right+border-right-width+margin-right；在quirks模式中：width是元素的实际宽度，contentwidth=width-(padding-left+padding-right+border-left-width+border-right-width)2）可以设置的高度和宽度内联元素在Standards模式下，为span等内联元素设置wdith和height不会生效，但在quirks模式下会生效。3）可以设置百分比的高度。在标准模式下，元素的高度由它包含的内容决定。如果没有设置父元素的高度，那么给子元素设置一个百分比的高度是无效的。4)使用margin:0auto设置水平居中在IE下会失效。使用margin:0auto可以在标准模式下水平居中元素，但在怪癖模式下会失败。quirk模式下的解决方法是使用text-align属性：body{text-align:center};#content{text-align:left}5）quirk模式下，图片的padding会失效。6)quirk模式下，Table中的字体属性不能继承上层的设置。7）在quirk模式下white-space:pre会失效8）盒模型解释不同31、css/js代码上线后，开发者往往会优化性能。从用户刷新网页开始，一个js请求一般缓存在哪里？处理？dns缓存，cdn缓存，浏览器缓存，服务器缓存。过度使用会导致手机耗电过大，增加PC的耗电量。也适用于移动终端。method等），scope的重定义，异步编程的解决（promise,async,await），解构赋值的出现ES6共性特性变量定义（let和const，variable和immutable，const定义特殊对象case)解构赋值模板字符串数组newAPI(eg:Array.from(),entries(),values(),keys())箭头函数(restparameter,spreadoperator,::bindthis)SetandMap数据结构(setinstancemembervalue唯一存储keyvalue，mapinstance存储键值对(key-value)）Promise对象（前端异步方案、生成器函数、async函数的演进史）类语法糖（super关键字）es6如何转换到ES5？使用Babel转码器，Babel配置文件为.babelrc，存放在项目根目录下。使用Babel的第一步是配置这个文件。45。MVC和MVVM的理解MVCView向ControllerController发送指令完成业务逻辑后，需要Model改变状态，Model向View发送新数据，用户得到反馈。所有的交流都是单向的。Angular使用双向绑定（数据绑定）：View中的更改会自动反映在ViewModel中，反之亦然。组件Model、View、ViewModelView：UI接口ViewModel：是View的抽象，负责View和Model之间的信息转换，将View的Command传递给Model；模型：数据访问层四十六、cookie和session的区别：1、cookie数据保存在客户端的浏览器中，session数据保存在服务器端。2.Cookie不是很安全。其他人可以分析本地存储的COOKIE，进行COOKIE欺骗。考虑到安全性，应该使用session。3.会话会在一定时间内保存在服务器上。当访问量增加时，你的服务器性能会被占用更多。为了降低服务器的性能，你应该使用COOKIE。4、单个cookie保存的数据不能超过4K，很多浏览器限制一个站点最多保存20个cookie。
