1.语义化
html标签的语义化：通过使用包含语义的标签（如header）恰当的表示文档结构
原因：去掉样式后页面呈现清晰的结构；盲人使用阅读器更好的阅读；搜索引擎更好的理解页面，有利于收录；便于团队项目的可持续运作与维护
2.简述对html语义化的理解
让页面的内容结构化，结构更清晰，便于浏览器、搜索引擎解析，在没有样式时也可以以一种文档格式显示，且是易阅读的，有利于SEO
3.DOCTYPE作用，标准模式与兼容模式的区别
<!doctype>声明位于HTML文档中的第一行，处于<html>标签之前，告知浏览器的解析器用什么文档标准解析这个文档。DOCTYPE不存在或格式不正确会导致文档以兼容模式呈现
标准模式的排版和JS运作模式都是以该浏览器支持的最高标准运行，在兼容模式中，页面以宽松的向后兼容的方式显示，模拟老式浏览器的行为以防止站点无法工作
4.页面导入样式时，使用link和@import的区别
link属于XHTML标签，除了加载CSS 外，还能定义RSS，定义rel连接属性等，而@import是CSS提供的，只能用于加载CSS；
页面被加载时，link会被同时加载，而@import引用的CSS必须等到页面被加载完后再加载
@import是CSS2.1提出的，只有IE5以上才能被识别，link是XHTML标签，无兼容问题
5.如何实现浏览器内多个标签页之间的通信
★websocket
★sharedworker
★postMessage
★iframe+contentWindow
也可以调用localStorage/cookie等本地存储方式
6.display:none和visibility:hidden的区别
display:none不显示对应的元素,在文档布局中不再分配空间(重绘+回流)
visibility:hidden隐藏时对应的元素,在文档布局中仍保留原来的空间(重绘)
7.重绘与回流(重排)
重绘:对元素的背景颜色,字体样式进行修改,不影响元素在文档流中的位置时,浏览器只会将新样式赋予元素并进行重新绘制操作
回流:因元素的尺寸,布局,隐藏等改变,浏览器需要重新渲染部分或全部文档
(回流必将引起重绘,重绘不一定引起回流)
8.居中方式
水平居中
★使用inline-block+text-align
对子元素设置display：inline-block，对父元素设置text-align：center
（此时子元素也会居中，可在子元素中设置text-align还原）
★使用table+margin
对子元素设置display：table，margin：0 auto
★使用absolute+transform
对父元素设置position：relative，对子元素设置position：absolute，left：50%，transform：translateX(-50%)
★使用flex+margin
对父元素设置display：flex，再对子元素设置margin：0 auto
★使用flex+justify-content
对父元素设置display：flex，justify-contentcenter
垂直居中
★使用table-cell+vertical-align
对父元素设置display：table-cell，vertical-align：middle
★使用absolute+transform
先将父元素设置position：relative，再设置子元素position：absolute，top：50%，transform：translateY（-50%）
★使用flex+align-items
对父元素设置display：flex，align-items：center
水平垂直居中
★使用absolute+transform
对父元素设置position：relative，对子元素设置position：absolute，left：50%，top：50%，transform：translate（-50%，-50%）
★使用inline-block+text-align+table-cell+vertical-align
对父元素设置 text-align：center，display：table-cell，vertical-align：middle，对子元素设置display：inline-blockBFC原理
☀内部的box会在垂直方向，一个接一个的放置
☀Box垂直方向的距离由margin决定，属于同一个bfc的两个相邻box的margin会发生重叠
☀每个元素的margin box 的左边，与包含块border box的左边相接触（对于从左往右的格式化，否则相反）。即使存在浮动也是如此
☀Bfc的区域不会与float box重叠
☀Bfc就是页面上的一个隔离的独立的容器，容器里面的元素不会影响到外面的元素，反之也是如此
☀计算bfc的高度时，浮动元素也会参与计算
形成bfc的条件
☀浮动元素，float除none外的值
☀绝对定位元素，position（absolute，flxed）
☀display：inline-block，table-cells，table-captions
☀overflow除了visible以外的值
18万+
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
