CSS快速入门学习二
一、外部样式表:适用于很多页面都需要用到样式表时
<head><link rel="stylesheet" type="text/css" href="mystyle.css" /></head>
用文本编辑器进行编辑,里面不能包含任何HTML的标签并以CSS为后缀保存就是一个样式表文件,如下内容
hr {color: sienna;} p {margin-left: 20px;} body {background-image: url("images/back40.gif");}需要注意的是在属性值和单位间不要有空间,否则只有IE6有效,在Mozilla/Firefox/Netscape中无效。
应该用
p {margin-left: 20px;} 而不是 p {margin-left: 20 px;}
二、内部样式表:
当某个文档需要特殊样式时,就可以用内部样式表,可以用<style>包在里面
<head> <style type="text/css"> hr {color: sienna;} p {margin-left: 20px;} body {background-image: url("images/back40.gif");} </style> </head>
三、内联样式表
只对当前元素使用,只要在相关标签内使用样式(style),可以包含CSS属性
<p style="color: sienna; margin-left: 20px"> This is a paragraph </p>
四、多重样式表
某些属性在不同的样式表中被同样的选择器定义,那么属性值将从更具体的样式表中被继承过来。
如,外部样式表针对h3选择器的三个属性
h3 { color: red; text-align: left; font-size: 8pt; }
而外部样式表拥有针对h3选择器的两个属性
h3 { text-align: right; font-size: 20pt; }
假如拥有样式表的这个页面同时与外部样式表链接,那么h3得到的样式是:
color: red; text-align: right; font-size: 20pt;