前端面试之浏览器内核

最新推荐文章于 2023-03-03 16:35:46 发布

Maaix

最新推荐文章于 2023-03-03 16:35:46 发布

阅读量136

点赞数

文章标签：面试前端 java

本文链接：https://blog.csdn.net/Maaix/article/details/124852226

版权

前端面试浏览器内核兼容性问题 HTML5 离线存储

关键词由CSDN通过智能技术生成

写在前面

CSDN话题挑战赛第1期

活动详情地址：CSDN
参赛话题：前端面试宝典
话题描述：欢迎各位加入话题创作得小伙伴，如果我没有猜错得话，我觉得你是应该同我一样是一位前端人。如今前端在IT事业中的占比越来越重，已经成为不可缺少的部分，前端技术也是层出不穷，各种技术类、技术框架也蜂拥而出，前端面试的难度也随之增加，如果我们拥有一套前端面试宝典。如果你是应聘者：你就可以从容的solo面试官，如果你是面试官：你就可以将应聘者拷问到骨子里！
总之我们大家一起将自己的面试经验以及学习到的知识点汇聚于此，形成一套体系的前端面试宝典。让读者无论是面试还是学习都能够有非常大的收获。就让我们携手共筑前端面试宝典吧！！！
创作模板：

携手共筑前端面试宝典

题目一

题目一

浏览器的内核分别是什么

考点

你做的页面在哪些流览器测试过？这些浏览器的内核分别是什么?经常遇到的浏览器的兼容性有哪些？怎么会出现？解决方法是什么？

html5 离线存储

答案

你做的页面在哪些流览器测试过？这些浏览器的内核分别是什么?经常遇到的浏览器的兼容性有哪些？怎么会出现？解决方法是什么？

1、DOCTYPE 影响 CSS 处理
2、FF: 设置 padding 后， div 会增加 height 和 width，但 IE 不会，故需要用 !important 多设一个 height 和 width
3、FF: 支持 !important， IE 则忽略，可用 !important 为 FF 特别设置样式
4、div 的垂直居中问题: vertical-align:middle; 将行距增加到和整个DIV一样高 line-height:200px; 然后插入文字，就垂直居中了。缺点是要控制内容不要换行
5、在mozilla firefox和IE中的BOX模型解释不一致导致相差2px, 解决方法： div{margin:30px!important;margin:28px;} 注意这两个margin的顺序一定不能写反，!important这个属性IE不能识别，但别的浏览器可以识别。

html5 离线存储

Html5的一个重要特性就是离线存储，所谓的离线存储就是将一些资源文件保存在本地，这样后续的页面重新加载将使用本地资源文件，在离线情况下可以继续访问web应用，同时通过一定的手法（更新相关文件或者使用相关API），可以更新、删除离线存储等操作。

Html5的离线存储使用一个manifest文件来标明哪些文件是需要被存储的，使用如 <html manifest='offline.manifest'> 来引入一个manifest文件，这个文件的路径可以是相对的，也可以是绝对的，如果你的web应用很多，而且希望能集中管理manifest文件，那么静态文件服务器是个不错的选择。