1、行内式
在HTML标记中使用style属性
- <p style="color:#ff0000;">......</p>
由于需要为每一个标记设置style属性,后期维护成本很高,而且容易显得臃肿,不推荐使用。
2、内嵌式
将CSS写在<head>与</head>之间,并且用<style>和</style>标记进行声明。
仅适用于对特殊的页面设置单独的样式风格。
3、链接式
- <head><link href="02-08.css" type="text/css" rel="stylesheet"></head>
4、导入式
采用import方式导入的样式表,在HTML文件初始化时,会被导入到HTML文件内,作为文件的一部分,类似内嵌式的效果。而链接式样式表则是在HTML的标记需要格式时才以链接的方式引入。
在HTML文件中导入的样式表,常用的有如下几种@import语句,可选择任意一种放在<style>与</style>之间:
@import url(sheet1.css);
@import url("sheet1.css");
@import url('sheet1.css');
@import sheet1.css;
@import "sheet1.css";
@import 'sheet1.css';
导入样式表的最大用处在于可以让一个HTML文件导入很多的样式表。也可以在样式表中导入样式表。
- <style type="text/css">
- <!--@import url(02-08.css);
- @import url(20-10.css);-->
- </style>