问题一：CSS有几种引入方式? link 和@import有什么区别?
1.外部样式表
使用link标签，将样式写在.css文件中，再以<link>标签引入。
例如：<link rel="stylesheet" type="text/css" href="index.css">
rel属性定义当前文档与被链接文档之间的关系。stylesheet是属性对应的值，意为文档的外部样式表。
type="text/css"告诉浏览器，这段标签内包含css或text，如果浏览器不识别css，会将代码识别成text.
2.内部样式表
使用<style>标签 ，样式写在<style></style>标签中，注意的事内部样式表写在html的<head>内，只对所在网页有效
<style type ="text/css">
p{color: red;}
</style>
3.内联样式
位于html元素内部，只对当前元素有效
<p style="color: #00f; font-size:1rem;">段落内容</p>
4.使用@import导入，也是样式提前写好在css文件中。
<head>
<style type="text/css">
@import "import.css"
</style>
</head>
link和@import有什么区别
不同点：
1.link是xhtml标签，除了加载css外，还可以定义rss等；@import属于css范畴，只能加载css。
2.link引用css时，在页面载入时同时加载；@import需要页面完全载入后加载。
3.link是xhtml标签，没有兼容问题；@import是在css2.1提出的，低版本浏览器不支持。
4.link支持使用javascript控制dom去改变样式；而@import不支持。
问题二：列出你所知道的选择器
1.基础选择器
*通用元素选择器：匹配页面任何元素
#idid选择器：匹配特定id元素
.class类选择器：匹配class包含特定的元素
element标签选择器
2.组合选择器
.E,.F{ }多元素选择器：同时匹配 .E和.F元素
.E .F{}派生选择器:选择e元素的所有后代f元素（如果不是子元素，向下递归）
.E>.F{ }子元素选择器：选择E元素的所有直接子元素F
.E+.F直接相邻选择器：匹配E元素之后的相邻统计元素F
.E~.F普通相邻选择器：匹配e元素之后的所有同级元素F（不论是否相邻）
代码
3.属性选择器
E[attr]:匹配所有具有属性为attr的元素（div[id]能选择所有具有id属性的div）
E[attr=value]:匹配所有属性为value的元素（div[type=text]匹配id=text的div）
E[attr~=value]:匹配所有属性attr具有多个空格分隔，其中一个值等于value的元素
E[attr ^=value]:匹配属性attr的值以value开头的元素
E[attr $=value]:匹配属性attr的值以value结尾的元素
E[attr *=value]:匹配属性attr的值包含value的元素
4.伪类选择器
E:first-child:匹配元素E的第一个子元素
E:last-child:匹配元素e的最后一个子元素
E:nth-child(n):匹配其父元素的第n个子元素，第一个编号为1
E:first-of-type:匹配父元素下使用同种标签的第一个子元素，等同于nth-of-type(1)
E:hover:匹配鼠标悬停智商的e元素
E:focus:匹配获得焦点的e元素
代码
5.伪元素选择器
E::first-line:匹配E元素的第一行
E::first-letter:匹配E元素的第一个字母
E::before:在e元素之前插入生成的内容
E::after:在e元素之后插入生成的内容
问题三： a:link, a:hover, a:active, a:visited 的顺序是怎样的？ 为什么？
顺序是 a:link>a:visited>a:hover>a:active ,总结缩写是lvha，lv包，ha！
在CSS中，如果对于相同元素有针对不同条件的定义，宜将最一般的条件放在最上面，并依次向下，保证最下面的是最特殊的条件。
鼠标滑过的“未访问链接”同时有a:link和a:hover 属性，后面的属性会覆盖前面的属性定义。同样，滑过“已访问链接”时候，hover属性会覆盖a:visited定义。a：hover要放在a：link和a：visited属性后，否则看不到效果。同理，a：active代表链接被点击的那一刻，按照行为先后应该放a：hover后面。
问题四：选择器优先级是如何计算的?
从高到低是：
1.在属性后面使用!important会覆盖页面内任何位置定义的元素样式
2.作为style属性写在标签上的内联样式
3.id选择器
4.类选择器
5.伪类选择器
6属性选择器
7.标签选择器
8.通配符选择器（使用星号*表示，意思是“所有的”）
9.浏览器自定义
①作用的更具体的选择器优先级越高
a：#parent p.class1
b：div #child.class1
<div id="parent">
<p id="child" class="class1">
Text
</p>
</div>
两个选择器作用的元素都是p标签，id选择器优先级最高，第一条规则作用在了父元素身上，第二条作用在p标签上，所以第二条选择器优先级高
②两个选择器优先级一样，后面的覆盖前面
