1.内联样式
在标签内使用style属性指定css代码
作用域：当前标签
例如：
<div style="color: red">hello css</div>不推荐使用，没有做到内容样式分离
2.内部样式
在head标签内，定义style标签，内容是css代码
<!DOCTYPE html><html lang="en"> <head> <meta charset="UTF-8"> <title>Title</title> <style> div{ color:blue; } </style> </head> <body> <div>hello css</div> <div>hello css</div> </body> </html>
作用域：页面内的所有div标签
3.外部样式
定义css资源文件。
在head标签内，定义link标签，引入外部的资源文件
作用域：在所有引入外部的资源的页面都可以生效
<!-- 资源文件都放在css目录下面，新建可以选择，一般新建一个文件后缀名为 .css 就行了 --> <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Title</title> <link rel="stylesheet" href="css/a.css"> </head> <body> <div>hello css</div> </body> </html>
a.css文件内容
div{
color: green;
}
第二种外部样式的引入
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Title</title> <style> @import "css/a.css"; </style> </head> <body> <div>hello css</div> </body> </html>
4.注意
1，2，3种的方式css作用范围越来越大
方式1不常用，后期常用2，3
第三种方式有两种写法