1、基本结构
选择器 {属性名:值;属性名:值},例如:
p {color:red;text-align:center;}
多个选择器用逗号隔开,如:
h1,h2,h3 {color:red;text-align:center;}
2、引用位置
<head>
<style type="text/css">
CSS样式。。。
</style>
</head>
3、引用方式
- 行内样式
在标签内添加style样式,如:
<p style="color:red;">内容</p>
- 内部样式表
<head>
<style type="text/css">
p {color:red;text-align:center;}
</style>
</head>
- 外部样式表
把CSS样式写在单独的.css文件中,引入.css文件方式:
<head>
<link rel="XXX.css" type="text/css" href="mystyle.css">
</head>
XXX.css是.css文件的相对路径或绝对路径
- 导入式
在style标签内使用@import引入外部文件:
<head>
<style type="text/css">
@import url(XXX.css);
</style>
</head>
几种方式的区别
优先级:
行内样式 > 内部样式>外部样式
*注:如果外部样式放在内部样式的后面,则外部样式>内部样式(就近原则:外部样式离定义标签更近)。