1. CSS选择器有哪些？
标签选择器
//所有div标签
<div></div>
<style>
div {
display: block;
}
</style>
类选择器
<div class="index"></div>
<style>
.index {
dixplay: block;
}
</style>
ID选择器
<div id="index"></div>
<style>
#index {
display: block;
}
</style>
伪类选择器
<ul>
<li></li>
<li></li>
<li></li>
</ul>
<style>
li:first-child {
background-color: black;
}
</style>
[attribute=value]
<input type='text' />
<style>
[type='text']{
font-size: 34px;
}
</style>
or
<div page='1'></div>
<style>
[page='1']{
background-color: blue;
}
</style>
结合Vue，可以快速实现同一页面中不同情况下的样式。
etc.
2. CSS 中哪些属性可以继承？
font-size （字体）
color （颜色）
font-style
font-weight
text-indent
line-height
etc.
3. CSS优先级算法如何计算？
css样式优先级：
行内样式 > ID选择器 > class选择器 > 标签选择器；!important可以覆盖其他样式，直接最大优先级。
优先级的计算值由四位数组成，从左到右，每位数逗号隔开，一级大于一级，数位之间没有进制，全局选择器* 以及其他选择器 > 低于一切其他规则。
4. 实现某不定宽高div水平垂直居中？
第一种方法使用flex定位，最简单
<style>
* {
margin: 0;
padding: 0;
}
body, html{
width: 100%;
height: 100%;
}
#box {
width: 100%;
height: 100%;
display: flex;
align-items: center;
justify-content: center;
}
#box div {
background: red;
color: white;
}
</style>
<body>
<div id="box">
<div>121</div>
</div>
</body>
第二种使用绝对定位transform元素偏移实现
<style>
* {
margin: 0;
padding: 0;
}
body, html{
width: 100%;
height: 100%;
}
#box {
width: 100%;
height: 100%;
position: relative;
}
#box div {
background: red;
color: white;
position: absolute;
top: 50%;
left: 50%;
transform: translateX(-50%) translateY(-50%);
}
</style>
<body>
<div id="box">
<div>121</div>
</div>
</body>
4. 自适应布局和响应式布局区别以及优缺点
响应式布局顾名思义，根据不同设备可以做出不同的响应，举例PC上是一种展示方式，手机上是另一种展示方式； 自适应布局，在不同的设备上可以自适应屏幕大小调整UI大小达到不同设备相同网页的效果。
5. em rem vw的区别
6. CSS优化提高性能的方法
从加载性能，选择器性能，渲染性能，可维护性和健壮性分析
