前端面试问题HTML篇：https://my.oschina.net/u/3674939/blog/1637883
前端面试问题JavaScript篇：https://my.oschina.net/u/3674939/blog/1640595
前端面试问题其它篇（安全、性能、加載等）：https://my.oschina.net/u/3674939/blog/1643029
文本不换行
/*单行文本*/
overflow: hidden;
text-overflow:ellipsis;
white-space: nowrap;
CSS样式优先级
!important > 行内样式>ID选择器 > 类选择器 > 标签 > 通配符 > 继承 > 浏览器默认属性
- 权重计算
- 后写优先
雪碧图的作用
- 减少HTTP请求数，提高加载性能
- 减少图片大小
display:inline-block的间距问题
由于空白字符的原因
解决：font-size: 0
如何清除浮动
- overflow:hidden
- ::after{clear:both}
- .clear{clear:both}
如何适配移动端
viewport rem media查询
响应式设计：隐藏、折行、自适应
页面三栏布局
- 浮动布局
- 定位布局
- flexbox布局
- 表格布局
- 网格布局
盒子垂直水平居中
- 定位 + margin：
position: absolute; left: 50%; top: 50%; margin-left:-自身一半宽度; margin-top: -自身一半高度;
- 定位 + transform：
position: relative / absolute;left: 50%; top: 50%;transform: translate(-50%, -50%);
- 表格布局：
父级 display: table-cell; vertical-align: middle; 子级 margin: 0 auto;
- flex 布局：
父级 display: flex;align-items: center;justify-content: center;
- 网格布局
参考：https://github.com/Sweet-KK/css-layout
CSS盒模型
标准模型：宽高 = content
IE模型：宽高 = border+padding+content
边距重叠问题
上下2个div分别设置margin-bottom和margin-top，margin值合并取最大值。父div嵌套子div并设子div宽高margin-top，父div=子div宽高并会margin值合并取最大值。
解决：overflow：hidden
BFC
块级格式化上下文
原理：BFC元素垂直方向的边距会重叠；BFC区域不会和浮动元素重叠；BFC是个独立容器里外互不影响；计算BFC高度时浮动元素也会参与计算
如何创建：overflow、 float、 postion(relative不算)、 dispay(只有inline-box和table相关的)
附：55道css面试题：https://segmentfault.com/a/1190000013325778