《走进前端技术栈--CSS》 个人笔记 | 青训营

在深入了解CSS之前，我观看了课程《走进前端技术栈--CSS》，这对理解昨天的课程《深入CSS》有很大帮助。

以下是我作的相关整理。

首先CSS的作用是用来定义页面元素的样式。

其次，CSS的基础代码举例为：

h1{
    color:white;
    font-size:14px;
   }

CSS在页面中的使用表现为外链、嵌入、 内联三种，其中使用最方便的是外链方式。

接下来就是对选择器类型的介绍。

1. 通配选择器：针对全体的设置。
2. 标签选择器：针对标签进行设置如（h1，h2等）。
3. id选择器：设置标签中id="xxx"，之后用#xxx来进行设置。（通常来说id是唯一的）
4. 类选择器：设置class="xxx"，之后用.xxx进行设置。
5. 属性选择器：如一些标签中有"disabled"等的设置，可用[disabled]进行设置。
6. 伪类选择器：伪类选择器分为多种，其中较重要的是状态型和结构型

（1）状态型

例如链接中 a:link{...}表示链接的默认状态、a:visited{...}表示被访问过的链接、a:hover{...}表示鼠标移上去的链接、a:active{...}表示鼠标点击的链接。

（2）结构型

例如有序列表ol li:first-child{...}表示有序列表中的第一个、li:last-child{...}表示有序列表的最后一个。

7.选择器组：标签之间用逗号隔开，如

h1,h2,ol,li,a{
     ...
}

自身感受与思考

在此次的学习中我感觉到对CSS技术的使用与选择器的使用密不可分，那么又有一些问题出现，当真正编撰网页代码时，选择器间的互相作用难免会有冲突，那么，到底听谁的? 我相信在之后的学习中会解决此问题。