CSS引入方式
■ 三种引入方式
按照CSS样式书写的位置(或者引入的方式)，CSS样式表可以分为三大类：
▶ 行内样式表(行内式)
▶ 内部样式表(嵌入式)
▶ 外部样式表(链接式)--推荐使用
■ 行内样式表
□ 使用说明
在元素标签内部的style属性中设定CSS样式，适合于修改简单样式
使用行内样式表设定CSS，通常也被称为行内式引入
注意：
▶ style其实就是标签的属性，属性值由双引号包括，双引号中样式的写法要符合CSS规范
▶ 可以控制当前的标签设置样式
▶ 由于书写繁琐，并没有体现出结构与样式相分离的思想，所以不推荐大量使用，只有对当前元素添加简单样式的时候，可以考虑使用
□ 示例
<div style="color:red; font-size:12px;" >行内样式表</div>
■ 内部样式表
□ 使用说明
将CSS写到HTML页面内部，将所有的CSS代码抽取出来，单独放到一个<style>标签中
使用内部样式表设定CSS，通常也被称为嵌入式引入，这种方式在练习或者调试时常用
注意：
▶ <style>标签理论上可以放在HTML文档的任何地方，但一般会放在文档的<head>标签中，通过此种方式，可以方便控制当前整个页面中的元素样式设置
▶ 该方式使代码结构清晰，但是并没有实现结构与样式完全分离
□ 示例
<style> <div> color: red; font-size: 12px; </div> </style> <div>内部样式表</div>
■ 外部样式表
□ 使用说明
将样式单独写到CSS文件中，之后把CSS文件引入到HTML页面中使用
实际开发都是外部样式表，适合于样式比较多的情况
引入外部样式表分为两步：
1) 新建一个后缀名为.css的样式文件，把所有CSS代码都放入此文件中
2) 在HTML页面中，使用<link>标签引入这个文件
□ 示例
CSS文件(XXX.css)
div { color: red; font-size: 12px; }
HTML文件
... <head> <link rel="stylesheet" href="CSS文件路径"> </head> ... <body> <div>使用外部样式表</div> </body>
■ 总结
□ 行内样式表
优点：书写方便，权重高
缺点：结构样式混写
使用情况：较少
控制范围：控制一个标签
□ 内部样式表
优点：部分结构和样式相分离
缺点：没有彻底分离
使用情况：较多
控制范围：控制一个页面
□ 外部样式表
优点：完全实现结构和样式相互分离
缺点：需要引入
使用情况：最多，推荐使用
控制范围：控制多个页面
