1.盒子塌陷

盒子塌陷：本应该在父盒子内部的元素跑到了外部。
关于盒子塌陷的几种解决方案：

1. 最简单，直接，粗暴的方法就是盒子大小写死，给每个盒子设定固定的width和height，直到合适为止，这样的好处是简单方便，兼容性好，适合只改动少量内容不涉及盒子排布的版面，缺点是非自适应，浏览器的窗口大小直接影响用户体验。
2. 给外部的父盒子也添加浮动，让其也脱离标准文档流，这种方法方便，但是对页面的布局不是很友好，不易维护。
3. 给父盒子添加overflow属性。
   overflow:auto; 有可能出现滚动条，影响美观。
   overflow:hidden; 可能会带来内容不可见的问题。
   4.父盒子里最下方引入清除浮动块。
   5.after伪类清除浮动。

2.为什么会出现盒子塌陷？

当父元素没设置足够大小的时候，而子元素设置了浮动的属性，子元素就会跳出父元素的边界（脱离文档流），尤其是当父元素的高度为auto时，而父元素中又没有其它非浮动的可见元素时，父盒子的高度就会直接塌陷为零， 我们称这是CSS高度塌陷。

3.CSS字体大小设置：em、rem、px

px（绝对长度单位）
em（相对长度单位）
涉及到弹性盒子模型。
rem（相对长度单位）
和em不同的是，rem总是相对于根元素（如：root{}），而不像em一样使用级联的方式来计算尺寸。

4.cookie sessionStorage localStorage区别

共同点：都是保存在浏览器端、且同源的。
区别：

1. cookie数据始终在同源的http请求中携带，即cookie在浏览器和服务器之间来回传递，而seesionStorage不会自动把数据发送给服务器，仅在本地保存。
2. 存储大小也不同，cookie数据不能超过4K，同时因为每次http请求都会携带cookie、所以cookie只适合保存很小的数据，如会话标识。seesionStorage和localStorage虽然也有存储大小的限制，但比cookie大的多，可以达到5M或者更大。
3. 数据有效期不同，seesionStorage：仅在当前浏览器窗口关闭之前有效；localStorage：始终有效，窗口或浏览器关闭也一直保存；cookie：只在设置的cookie过期时间之前有效，即使窗口关闭或浏览器关闭。
4. 作用域不同，seesionStorage不在不同的浏览器窗口中共享，即使是同一个页面；localStorage在所有同源窗口中都是共享的；cookie也是在所有同源窗口中都是共享的。