HTML引用CSS的样式表现在常用的有三种:
1,使用内部样式表;
2,外部样式表;
3,行内样式表。
<link rel = "style sheet" href = "main.css"
资源的类型是样式表,资源的位置是当前目录下的main.css文件,引用css文件的路径放置在<head>标签里。
使用外部样式表:
CSS代码在一个独立的文件中,HTML通过link元素引入到页面使用外部样式表的特点:
- 实现了内容结构和表现形式代码分离方便复用和维护。(多个网页引用一个CSS文件)
- 使HTML代码更纯净,有利于程序员和搜索引擎的阅读。(搜索引擎只能抓取HTML代码)
- 是开发页面的常见做法
使用内部样式表:
将CSS代码写到HTML文档的style元素内容中,推荐在测试代码中使用。
<style type = "text/css">
h1{color:red; text-align:center;}
</style>
特点:
- 没有了样式表文件,在某些时候可以提升效率
- 多个页面难以共享样式,不利于代码复用
- HTML和CSS代码混杂,不利于程序员和搜索引擎阅读
- 在某些对效率要求苛刻或测试的场景下使用
使用行内样式表:CSS代码写在元素的style属性中,行内样式不写选择器