//格式：
*{
//属性：值;
}
//选择全部标签，用*号表示;

//示例：
* { 
font-size:20px;
}
//元素
<div id='boot'>
兄弟抱一下
</div>
<h1>风吹雨打</h1>
<p通用选择器</p>

:active a:active  选择活动链接。
::after p::after  在每个 <p> 的内容之后插入内容。
::before  p::before 在每个 <p> 的内容之前插入内容。
:checked  input:checked 选择每个被选中的 <input> 元素。
:default  input:default 选择默认的 <input> 元素。
:disabled input:disabled  选择每个被禁用的 <input> 元素。
:empty  p:empty 选择没有子元素的每个 <p> 元素（包括文本节点）。
:enabled  input:enabled 选择每个启用的 <input> 元素。
::first-letter  p::first-letter 选择每个 <p> 元素的首字母。
::first-line  p::first-line 选择每个 <p> 元素的首行。
:focus  input:focus 选择获得焦点的 input 元素。
:fullscreen :fullscreen 选择处于全屏模式的元素。
:hover  a:hover 选择鼠标指针位于其上的链接。
:in-range input:in-range  选择其值在指定范围内的 input 元素。
:indeterminate  input:indeterminate 选择处于不确定状态的 input 元素。
:invalid  input:invalid 选择具有无效值的所有 input 元素。
:lang(language) p:lang(it)  选择 lang 属性等于 "it"（意大利）的每个 
<p> 元素。
:link a:link  选择所有未访问过的链接。
:not(selector)  :not(p) 选择非 <p> 元素的每个元素。
:optional input:optional  选择不带 "required" 属性的 input 元素。
:out-of-range input:out-of-range  选择值超出指定范围的 input 元素。
::placeholder input::placeholder  选择已规定 "placeholder" 属性的 
input 元素。
:read-only  input:read-only 选择已规定 "readonly" 属性的 input 
元素。
:read-write input:read-write  选择未规定 "readonly" 属性的 
input 元素。
:required input:required  选择已规定 "required" 属性的 input 元素。
:root :root 选择文档的根元素。
::selection ::selection 选择用户已选取的元素部分。
:target #news:target  选择当前活动的 #news 元素。
:valid  input:valid 选择带有有效值的所有 input 元素。
:visited  a:visited 选择所有已访问的链接。

//并不是所有的属性都可以继承，只有以
1.color开头
2.line开头
3.font-开头
4.text-开头
才会进行继承
继承的属性会在开发者工具上显示，选中当前元素，上面有 linhetied form div 就是说当前属性继承来自于div
高亮的就是继承的，灰色的或者被划掉的就是未被继承的属性
//特殊元素
a标签的字体颜色和下划线不会被继承属性所影响
h标签的字体大小不会被继承属性所影响

p{
color:red;
}
#pp{
color:blue;
//这个生效因为他的层级高
}
<p id='pp'>继承性</p>

1.继承的话是谁离当前选中的标签近谁的优先级就高;
例子:
li{
color:blue;
//当前的li离p比较近，所以就优先继承li的，所以li的权重就高
}
ul{
color:red;
}
<ul>
<li>
<p> 优先级</p>
</li>
</ul>
2. 优先级的选择器赋值相同的属性，只会选择最后的属性;

p{
color:red !important;
}
<p>优先级最高</p>

transition-property:当前需要过渡的属性(多个属性以,号隔开);
transition-duration:过渡动画需要执行的秒数(多个属性执行动画时长以,号隔开);
transition-delay:延迟几秒后开始执行动画;
transition-timing-function:控制过渡动画的速度;
div{
width:300px;
height:20px;
background:red;
transition-property:width,background;
//从300到800需要2秒完成
transition-duration:2s,2s;
//延迟俩秒后开始执行动画
transition-delay:3s;
}
div:hover{
//过渡完成的属性在hover里面写
width:800px;
background:green;
}

transition:width 2s  linear 1s,background 2s  ;
//如果过渡属性很多(过渡时间和速度以及延时时间都一样的情况下)可以采用all的
//方式,当前元素的所有过渡属性都执行过渡,且都是5秒执行时间
transition:all 5s;

//代表多少度,10deg代表10度
transform:rotate(10deg);

//第一个值代表x轴,第二个值代表y轴
transform:translate(100px,0);

//第一个值代表x轴放大或缩小,第二个值代表y轴放大或缩小
transform:scale(1.5,1.5); //1.5是倍数

//多个属性用空格隔开
transform:scale(1.5) translate(100px,0); 

取值有三种：
1. px
2.百分比
3.关键字 left  top
//第一个值是X轴的位置，第二个值是Y值的位置
transform-origin:100px 20px; 

//在rotate后面加上自己想旋转的轴向就行了,默认是Z轴
//写了之后必须加上透视属性才能明显起来(透视属性只能加给旋转元素的上级，
//默认父级元素)
transform:rotateX(10deg);
transform:rotateY(10deg);

perspective: 距离值;