CSS基础语法与选择器，控制DIV
一、CSS代码的三种书写位置与适用
CSS样式代码有三种书写位置，分别是行内样式、内部样式表、外部样式表，三种方式适用场景不同，在DIV+CSS布局中，主流规范用法是外部样式表，新手需要明确区分三种方式的用法与优缺点。
第一种是行内样式，直接把CSS样式写在DIV标签的style属性中，属于最直接的写法，优点是无需定义选择器，样式直接生效，缺点是无法复用，代码冗余，不符合结构样式分离规范，只能用于临时测试样式，绝对不能用于正式
第二种是内部样式表，把CSS代码写在HTML页面的head标签内的style标签中，样式只对当前页面生效，适合单个页面的样式编写，无需单独创建CSS文件，适合新手练习、单页面网站使用，也是本教程练习阶段主要使用的方式。
第三种是外部样式表，把所有CSS代码单独写在后缀为.css的文件中，在HTML页面中通过link标签引入调用，这是正式网站开发的标准规范用法，优点是一个CSS文件可以被网站所有页面调用，样式统一，修改便捷，代码复用率极高，大型网站、企业官网、门户网站全部采用这种方式，新手后期实战必须掌握。
二、CSS基础语法规则与书写规范
CSS语法规则非常简单，核心结构分为两部分，分别是选择器和声明块，标准语法格式为：选择器 { 属性名: 属性值; 属性名: 属性值; }。选择器的作用是选中需要控制的HTML标签，也就是我们需要控制的DIV；声明块用大括号包裹，内部写需要设置的样式属性，每一条样式属性以分号结尾，最后一条属性可以不写分号，但规范写法必须全部添加分号，避免代码出错。
书写CSS代码时，需要遵守基础规范，保证代码可读性与可维护性。首先是属性换行，每一条样式属性单独占一行，缩进对齐，不要把所有属性写在同一行，方便后期查找修改。其次是小写规范，所有选择器、属性名、属性值全部使用小写字母，HTML标签也统一使用小写，符合W3C标准规范。最后是注释规范，复杂样式可以添加注释说明功能，但正式代码中不要添加多余注释，保持代码简洁。
新手最容易犯的语法错误，就是忘记写分号、大括号不匹配、属性名书写错误、冒号写成空格，这些小错误会导致样式完全不生效，学习初期一定要养成规范书写的习惯，避免出现低级语法
三、DIV+CSS布局最常用的三类基础选择器
选择器是CSS控制DIV标签的核心，在常规网页布局中，90%的场景只需要用到三类基础选择器，分别是标签选择器、类选择器、ID选择器，新手只需要熟练掌握这三类选择器，就可以完成所有常规布局控制，无需一开始学习复杂的高级选择器
第一类是标签选择器，直接使用HTML标签名作为选择器，会选中页面中所有该标签，统一设置样式。比如直接写div { width: 100%; }，就会控制页面中所有DIV标签的宽度为100%，适合统一设置页面所有标签的默认样式，比如清除默认边距、统一字体样式，缺点是无法单独控制某一个DIV，
第二类是类选择器，也是DIV+CSS布局中最常用、最核心的选择器，使用英文点号开头，后面自定义类名，在DIV标签中通过class属性调用。类选择器最大的优势是可以复用，同一个类名可以给多个DIV调用，一个DIV也可以调用多个类名，灵活性极强，所有布局模块、样式设置，主流都使用类选择器
第三类是ID选择器，使用英文#号开头，后面自定义ID名，在DIV标签中通过id属性调用。ID选择器具有唯一性，一个ID名在一个页面中只能使用一次，不能复用，适合控制页面中唯一的模块，比如网页头部、底部版权、轮播容器，常规布局不建议频繁使用ID选择器，优先使用类选择
四、选择器优先级与样式
很多新手会遇到一个问题，给同一个DIV设置多个样式，部分样式不生效，核心原因是选择器优先级不同，优先级低的样式会被优先级高的样式覆盖。CSS选择器优先级遵循固定规则，优先级从高到低依次为：行内样式 > ID选择器 > 类选择器 > 标签选择器。
简单理解，行内样式优先级最高，只要写了行内样式，就会覆盖其他所有样式；ID选择器优先级高于类选择器，类选择器优先级高于标签选择器。如果优先级相同，就遵循就近原则，写在后面的样式会覆盖前面的样式。新手布局时，尽量统一使用类选择器，避免混用ID选择器和行内样式，减少样式冲突问题。
同时需要注意，所有样式都遵循层叠规则，相同属性的样式，只会生效优先级高的那一个，不同属性的样式会叠加生效。比如给一个DIV同时设置宽度和背景色，两个属性会同时生效，不会相互影响，只有相同属性才会出现覆盖情况。理解选择器优先级，是解决样式不生效、样式冲突问题的核心，新手必须熟练
