css 层叠样式表 多个样式用 ；(分号) 隔开，
id 去指定的位置 是唯一标识
href 指向外部css的样式表
css的注释 ：/* */ (必须在style里面写) (缩进)
Sublime 快捷方式:
ctrl + shift + s 文件另存为
ctrl + s 保存
ctrl + 回车 另起一行
ctrl + shift + 回车 在上面另起一行
h2 * 数字1.... 出来多少对
ctrl + Alt + 向下箭头 多选 多行起编辑
ctrl + / 加注释
ctrl + shift + / 多行代码注释
ctrl + shift +k 删除一行
ctrl +z 撤销
nth 表示第几个 从一开始
内联框架 优先级 1000
id选择器 优先级 100
类和伪类 优先级 10
元素选择器 优先级 1
通配* 优先级 0
！import 优先级最高，尽量不用
> 表示包含 ul 里面包含 li ul>li*4
ul 是列表 ， li 是包含的列表项
$代表顺序出现的1234
id 用#表示 p#p$*3
块元素 自己独占一行
常见的块元素 : div p h1~h6 ul li .....
dir 对页面进行布局的 style 可以在里面写
内联元素也叫行内元素，只占自己的大小，不会独占一行
常见的行内元素 : span a img iframe....
什么时候一行排不下就会另起一行
大多数用块元素包含内联元素，a 是超链接 都可以包含
a 超链接标签可以包含任意元素 除了它本身
元素选择器 : 标签名{} 例: h1{}
id 选择器 : 语法：#p{}
类选择器 : .p2{}
通配选择器 : *{}
第一关 plate ，（plate元素）
第二关 bento ，（bento元素）
第三关 #fancy ，（id为fancy的元素）
第四关 plate apple ，（plate祖先元素下的apple后代元素）
第五关 #fancy pickle ，（id为#fancy的祖先元素下的pickle后代元素）
不第六关 .small ，（组为small的元素）
第七关 orange.small ，（组为small的orange元素）
第八关 bento>orange.small ，（bento父元素下的组为small的orange子元素）
第九关 plate,bento,div ，（plate,bento兄弟元素在div元素中）
第十关 * ，（*代表所有元素）
第十一关 plate>* ，（plate父元素的所有ziyuansu）
第十二关 plate + apple ，（兄弟元素选择器，plate元素的后一个元素）
第十三关 bento~pickle ，（兄弟元素选择器,bento元素后的多个pickle元素)
第十四关 plate>apple ，(plate父元素下的apple子元素)
第十五关 plate orange:first-child ， (子元素选择器，plate元素下的第一个orange元素)
第十六关 plate :only-child
，（所有plate元素下的元素）
第十七关 #fancy :last-child,pickle:last-child ，（id为fancy的元素的最后一个和pickle元素的最后一个）
第十八关 div plate:nth-child(3)
，（div元素中的第三个plate元素）
第十九关 div bento :nth-last-child(4) ，（div元素中倒数第四个bento元素）
第二十关 apple:first-of-type （第一个apple元素）
第二十一关 plate:nth-of-type(even) ，（所有偶数个的plate元素）
第二十二关 plate:nth-of-type(3),plate:nth-of-type(5) ，（plate元素下的第3个和第5个元素）
第二十三关 plate apple.small:only-of-type ，（plate元素下满足apple.small元素的唯一一个元素）
第二十四关 orange.small:last-of-type,apple.small:last-of-type ，（是orange.samll和apple.small元素的最后一个元素）
第二十五关 bento:empty ，（bento元素里没有包括额外元素）
第二十六关 apple:not(.small) ，（apple里没有组是.small的元素）
