1、
一个网页的开发流程
- 内容结构，比如js、css
- 页面结构。自上而下，从左往右。（内容、颜色块、间距、边框）
2、
line-height的5种设置方式及区别 normal || 1.5 || 150% || 50px || 5em
初始化元素的时候，一般使用 line-height: 1.5 这种方式，它区别于其它四种方式的
根本原因在于元素继承后的计算方式
比如body初始化为 body{font-size: 14px; line-height: 1.5}
则body里的元素都会这样继承
div{font-size:20px} ——>继承后line-height是 20 x 1.5 = 30px
又比如body初始化为 body{font-size: 14px; line-height: 150% || 5em }
则body里的元素都会继承计算后的行高默认值
div{font-size:20px} ——>继承后，line-height 只会被默认为 14 x 150% = 21px
‘\5b8b\4f53’ 万国码，这串数字是转码后的表示，它对应的中文是“宋体”
为什么不使用 font-family:"宋体"呢？因为在全世界，别的浏览器不一定会识别中文，但一定识别Unicode字符。
3、
css模块化
@规则
- @charset 设置样式表的编码
- @import 导入其它样式文件
- @media 媒体查询
- @font-face 自定义字体/图标
4、
标签栏上的图标显示
——图标格式的后缀是 favicon.ico 可通过一些线上工具去生成这种格式
——放在网站的根目录，与首页同级
——link 引入，比如<link rel="icon" href="favicon.ico">
——IE在file协议下显示不出来
5、
base标签
——定义文档当中所有url的基础目录或链接
——定义文档当中所有target的默认值
——文档只能定义一个base标签
基础链接
基础目录
6、
自定义字体、图标的使用方式
用@font-face引入，可以将图标像字体一样定义
.eot格式只针对IE的，其它浏览器都不认识
.ttf格式是系统文件的格式，特别大，IE9+支持，其它都不支持
.svg一种图形的技术，可修改且不失真，浏览器都支持
format 为了性能的优化，建议不要省略，浏览器会根据它识别是否需要从服务器下载，因为浏览器可能已经有这个格式了
——最好用的是阿里的图标库
7、
行级元素的回车会被自动解析成一个空格，而空格的间距其实是由父级的font-size决定的，当设置它所在的父级font-size：0时，就没有默认空格的间距了
8、
h标签的使用也跟SEO有关系，标签的重要性在seo是有优先级的。
- title标签 > h1标签（主标题）> h2标签（副标题）> h3标签（板块标题）> h4标签（板块内一级标题）> h5标签（板块内嵌套板块的标题）> h6标签（同h5），一般用到h4就够了
- 一个页面只要1个h1标签，且h1~h4系列标签都要用上
- 如果一个页面没有很醒目的标题给h1标签，就把h1给logo，并且以图换字，参考淘宝
9、
IE8如何兼容css3的线性渐变？
——滤镜filter
‘#ffff9000’——前两个ff代表透明度
GradientType=1 1代表水平方向，0代表垂直方向
10、calc函数 IE9+
11、
rgba函数 IE9+
flex弹性布局 IE10+
12、
两个边框重叠的1px问题
13、
webp格式的图片 谷歌开发 IE不支持 火狐65+
- 占用空间更小，甚至比其它同类型图片小10倍以上
- 清晰度却不变
- 需要JavaScript来解决兼容性问题
14、
关于伪元素使用一个冒号，可以兼容IE8，IE8对于伪元素只认识一个冒号，伪类使用两个冒号
