css学习指南

推荐有一定css经验的人阅读，结合实际场景可系统性学习css各个知识模块

作者:gaocc / 修订时间：2023-03-14

历史

1996开始有css1，1998有css2，然后采取了独立模块开发方式，即现有功能分开开发，不必等到所有模块都达到css3的标准才一起发布。所以现在我们使用到的css是: 部分css功能是css3，部分是css4或者css2

基础概念

元素类型

置换元素：置换元素的内容不是文档直接表示，如img，input标签

非置换元素：非置换元素的内容是文档直接表示，span，div等几乎全部的标签

元素显示方式

块级：块级元素，生成一个填满父级元素内容的框，前后断行，例如p，div标签

行内：行内元素，不前后断行，例如a，span标签

tip: 行内非置换元素(如span)，不支持设置width，height

选择器

id选择，类选择，属性选择，伪类选择，伪元素选择，如果没有依附某个元素，默认是通用选择器

直接选择

• 通用选择：*{color: red};
• 群组选择：h1, p {color: red};
• 类选择：标签定义class后 .error{color: red};
• 依附元素的类选择：div.error{color: red};