前端开发常见笔试/面试题总结 -- HTML / CSS篇

时间 2019-11-16

标签前端开发常见笔试面试总结 html css 栏目快乐工作繁體版

原文原文链接

室友同为前端开发，最近在他找工做的时候，讨论到了常见的前端笔试题和面试题，今天就来总结一下以前校招和社招时频繁遇到的面试题。css

iframe 有哪些缺点?

共同点是都保存在浏览器端，区别以下：html

cookies是为了标识用户身份而存储在本地的数据，会随http请求一同发送到服务器，而localStorage和sessionStorage仅在本地保存，不会自动把数据发给服务器
cookie保存的数据不超过4k，而localStorage和sessionStorage保存的数据可达到5M
cookie在过时以前一直有效，即便窗口或者浏览器关闭。localStorage始终有效，窗口和浏览器关闭也一直保存，用做长久数据保存，sessionStorage仅在浏览器窗口关闭以前有效。
cookie数据在全部同源窗口都共享。localStorage也是在全部同源窗口都共享，而sessionStorage不在不一样的浏览器共享，即便同一页面

在head中加入manifest属性，它会请求manifest文件，第一次访问时，浏览器会根据manifest文件的内容下载相应的资源，并进行离线存储。若是已经访问过而且资源已经离线存储了，那么浏览器就会使用离线的资源加载页面。前端

为了在不一样浏览器的标准模式与怪异模式下都能保持一致，可用如下方法：
一、使用divweb

<div style="width: 100%; height: 1px; background-color: black" />

二、使用hr，不建议直接使用size属性，由于新的标准里已经废弃直接使用标准的方式面试

<hr style="height: 1px" />

绝对定位：浏览器

main {
       position: absolute;
       top: 50%;
       left: 50%;
       transform: translate( -50%, -50% );
   }

flexbox布局：服务器

display: flex, justify-content: center, align-items: center

标准模式又称严格模式，浏览器使用 W3C 的标准解析渲染页面
怪异模式又称混杂模式，浏览器都按照本身的方式解析渲染页面，在不一样的浏览器网页会显示不一样的样式session

最好的方法就是添加了文档类型声明，好比<!DOCTYPE html>，浏览器会用W3C的标准来渲染网页布局

外边距合并(叠加)：当两个垂直(不包含水平)外边距相遇时，它们将造成一个外边距。合并后的外边距的高度取外边距高度中的较大者。

方法：能够用BFC的方式解决，所谓的BFC就是css布局的一个概念，是一块区域，一个环境。