CSS 基础｜ 青训营笔记
这是我参与「第四届青训营 」笔记创作活动的的第2天
1.什么是CSS
CSS(层叠样式表 Cascading Style Sheets)是一种用来表现HTML（标准通用标记语言的一个应用）或XML（标准通用标记语言的一个子集）等文件样式的计算机语言。CSS不仅可以静态地修饰网页，还可以配合各种脚本语言动态地对网页各元素进行格式化。
**样式定义显示 HTML 元素的语法为：
selector {property：value} (选择符 {属性：值})
2.页面中使用CSS的三种方式
（1）外链
将css的定义放在一个单独文件中，使用link标签引入
（2）嵌入
直接将样式代码嵌在HTML文件中
（3）内联（不推荐）
对于标签的样式写在标签的style属性中
3.CSS是如何工作的
（1）选择器
- 按照标签名、类名或id
- 按照属性
- 按照DOM树中的位置
- 通配选择器“*”
可以对属性值进行匹配，并不是严格意义上等于某个值
通过伪类选择器
对链接、输入框设置样式，某种状态、结构(某结点所在位置）下的伪类
组合
颜色
- rgb（0,0,0）
- 简单表示：#bfbfbf（每两位16进制表示三原色比例）
- 使用关键字表示
- alpha调节透明度（放于其他方式最后）
字体
衬线体、无衬线体、手写体、艺术体、等宽字体
行间距
line-height 属性用于设置行间的距离（行高）。可以控制文字行与行之间的距离 语法： p { line-height: 26px; } 行高的文本分为 上间距 文本高度 下间距 = 行间距
行高测量技巧：上一行的最下沿到下一行的最下沿 ##css样式表： 按照 CSS 样式书写的位置（或者引入的方式），CSS 样式表可以分为三大类： ###行内样式表（行内式） 行内样式表（内联样式表）是在元素标签内部的 style 属性中设定 CSS 样式。适合于修改简单样式. 语法：
1.style 其实就是标签的属性 在双引号中间，写法要符合 CSS 规范 2.可以控制当前的标签设置样式 3.由于书写繁琐，并且没有体现出结构与样式相分离的思想，所以不推荐大量使用，只有对当前元素添加简单样式的时候，可以考虑使用 4.使用行内样式表设定 CSS，通常也被称为行内式引入
学习感悟
为了便于对页面的样式进行设计，有必要对CSS技术进行学习。通过CSS技术可以设计出想要的页面效果。采用外链或嵌入方式的CSS与HTML内容是分开的，这极大地方便了我们阅读、修改程序，也增强了CSS的复用性，提高了程序编写的效率。只需要在html文件中通过link标签引入CSS文件即可，这对设计者来说十分方便的。CSS的功能较为强大，学习它可以设计出各种较为常用的样式，极大丰富了网站的外观。学习CSS不仅要学它的使用，更要学习如何合理的运用到你想要表达的页面当中去，打造一个属于你自我特色的页面，这种实践内容才是学习的目的，才能促进我不断进步。
