这是我参与[第五届青训营]伴学笔记创作的第2天

今天学习的是css，今天学习的css选择器，伪类，布局相关技术，bfc，ifc，还有定位，以及一些css属性。

css选择器有：id,类,标签，属性选择器等等。

从上面图中可以看到，id选择器对应的第一行123的样式，class选择器对应的小写abc，标签选择器对应的大写ABC，还有属性选择器对应的周XX。

选择器是由优先级的，在这4个选择器中，id选择器的优先级是最高的，其次是类选择器，然后是标签选择器。

常用的有：：link是默认的伪类状态。：hover是鼠标悬浮在所选元素上面的状态。：visited是表示用户已访问过的链接。：active匹配用户激活的元素。：foucus获取焦点

来时讲解的课程中讲到比较重要的属性，比如width，height，padding，margin，border等等。其中重要的常用属性border，height，width，padding，margin。

上图中，border是盒子边框属性，height是盒子的高，width是盒子的宽，padding是内边距，margin是外边距。

定位有几个重要的元素，static，relative，absolute，fixed。其中static是默认定位，不实现任何效果。

盒子1是相对定位，不脱离文档流，所以盒子1下移50px，原本的位置也会占据。

盒子2是相对定位，脱离文档流，因为盒子1占据了原本的位置还有新的位置，盒子2会在原本盒子后的地方显示。

还有fixed定位，fixed是固定定位，相对于窗口的固定定位，不管你窗口的变化，始终在固定同一个位置显示。

块级盒子内的元素无论如何操作，都不会影响到外面的元素，ifc规则也是类型，不同的是一个是块级，一个是行内。

新的排版上下文，可以控制盒子的摆放流向。

如上图所示，row为横向排列，colmun为纵向排列。 justify-content控制元素在主轴上排列。 align-items控制元素在侧轴上排列。

老师还讲解了更多的css属性，比如浮动隐藏，元素的换行显示，还有盒子模型。还给我们提供了一些css的建议在结尾部分，老师希望我们能够持续的学习，因为css新特性在不断的出现。