firefox:gecko
ie:trident
safari:webkit
chrome: webkit ---> 基于webkit开发了Blink
opera:Presto ---> webkit ---> Blink
样式表：
规则集：选择器(浏览器从右向左读) 声明块组成
声明块：声明组成
声明：合法的css属性的键值对(属性 属性值)组成
引入CSS样式有三种方式，分别是：行内样式、内部样式、外部样式。
<标签名 style='样式'>xxx</标签名>
<!DOCTYPE html>
<html lang='zh-cn'>
<head>
<meta charset='UTF-8'>
<title>行内样式 demo</title>
</head>
<body>
<p style='color:blueviolet;font-size:15px;'>Lorem ipsum dolor sit amet.</p>
</body>
</html>
将样式写在<head>标签中，用style标签将样式包裹起来。
<head>
<style>
a{
display: block;
background-color: rgb(180, 146, 212);
width: 200px; /*转换为块元素后可设置其宽度*/
height: 200px; /*转换为块元素后可设置其高度*/
}
</style>
</head>
<body>
<a href='https://www.baidu.com'>行内元素转换为块元素</a>
<a href='https://www.baidu.com'>在CSS样式中将display的值设置为block;</a>
</body>
在<head>标签中写<link rel='stylesheet' href='样式表名.css'>，href的值需要单独建一个扩展名为.css的样式文件,注意路径。
<head>
<link rel='stylesheet' href='style.css'>
</head>
<body>
<p>Lorem ipsum dolor sit amet.</p>
</body>
在编码时，我们利用选择器来为各个元素设置样式。基本的选择器分别为：标签选择器、类(class)选择器、id选择器。
标签名{样式}
<style>
p{
font-size: 15px;
color: #81c6f8;
}
</style>
<p>
Lorem ipsum dolor sit amet consectetur adipisicing elit. Magni
</p>
<标签 id='id名'>xxx</标签>
#id名{样式}
<head>
<style>
#p{
color: #eabdca;
font-style: italic;
}
</style>
</head>
<p id='p'>Lorem, ipsum dolor sit amet consectetur adipisicing elit.
</p>
祖先元素选择器 后代选择器
<head>
<style>
#p{
color: #eabdca;
font-style: italic;
}
</style>
</head>
<div id=''>
<p class='p'>Lorem, ipsum dolor sit amet consectetur adipisicing elit.
</p>
</div>
<标签 class='class名'>xxx</标签>
.class名{样式}
<head>
<style>
.p{
font-family: 'Courier New', Courier, monospace;
color: blueviolet;
}
</style>
</head>
<p class='p'>Lorem ipsum dolor sit amet consectetur adipisicing elit. </p>
其余更高级的选择器可去以下地址查看
https://www.w3.org/TR/2011/REC-css3-selectors-20110929/
--ID属性值 0,1,0,0
--类，属性，伪类 0,0,1,0
--元素，伪元素 0,0,0,1
--通配符 0,0,0,0
--内联声明(标签中的样式) 1,0,0,0
--继承没有特殊性
注：当声明发生冲突时，选择器特殊性越大越占优势。
重要声明(!important)覆盖普通声明。
0特殊性(通配符)大于无特殊性(继承)。
--按来源排序
来源：
<1>读者
<2>创作者
<3>用户代理
权重：
<1>读者的重要声明(只有IE有)
<2>创作者的重要声明
<3>创作者的普通声明
<4>读者的普通声明
<5>用户代理(浏览器)的声明(无重要声明)
--按选择器的特殊性排序
如上：选择器的特殊性
--最终按顺序排序
--
top left
x轴的正方向 就是 前端坐标系的正方向
y轴的负方向 才是 前端坐标系的正方向
--
bottom right
x轴的负方向 就是 前端坐标系的正方向
y轴的正方向 才是 前端坐标系的正方向
示意图：
联系客服
