这是我参与「第五届青训营 」伴学笔记创作活动的第 3天
选择器的分类：
分为：id，（伪）类，标签，优先级依次降低 这里还学到了继承，现在稍微有点能理解了，就是从父类继承过来属性，比如body设置的背景色在下面的也能用，除非显式设置一个值
在css中每个属性都有一个初始值
可以使用initial来实现初始化，如：background-color：initial
盒模型
这里学到的一个有帮助的是width的设置时，仅仅只是给content设置，总体的长宽还要考虑padding、margin的大小，还有在设置height的百分数形式时，一定先有了总体的高度才能用百分数来实现
数字排列代表着：上左下右
border
在设置border时，有三个属性，分别是width，style，color（我经常只设置宽度忘记了后面的，以后一定要记住）
margin-auto：水平居中（特例）
margin里有一个有趣的例子是如果这个盒子设置了底部100px，紧接着下一个盒子设置了顶部100px，实际上他们俩的距离只有100px（参考视频）
理解行级vs块级
块级（Block）：
不与其他盒子并列排放（如<h1>xxx<p>xxx</p>xxx</h1>会显示是在两行，而inline会显示在一行），适用于所有盒的属性（如：padding，margin等），一般有：body,article,div,h,p,ul,li等
行级（Inline）：
和其他级盒子放在一行或者拆成多行，对于设置的width或者height不起作用，一般有：span,em,strong,code等
display属性
但是在css中可以通过display:block和display:inline来转换，在display里有一个display:inline-block，是本来是行级，可以放在盒子中，简单理解就是像一张图片只能放在一行不能被分割放在两行，还有display:none，指排版时完全忽略那些行级块级
flex-grow
是像弹簧一样可以在空间足够的情况下被伸展
flex-
像弹簧一样在空间不足的情况下被压缩
flex和grid的区别：
flex是比较单一的一个布局，而grid更加多样二维
grid里面有一个grid-temolate-columns和rows，一个是列一个是行，相关属性查资料，有px的也有百分比的，这里没有学过不太懂
还有网格线：grid-area的用法如：1/1/2/2表示从行的第一个线和第一列第一个线开始到行的第二个线和列的第二个线结束（float居然也是grid里面的！！！）
