单个的CSS样式放在一起就组成了一个样式表
。而CSS样式表的类型也有两种:
内部样式表和外部样式表
。具体取决于该样式所处的位置
,如果它是处于本网页上
,它就是内部样式表,如果它是链接到HTML网页的另一个CSS文件上,那它就属于外部样式表。
内部样式表是由多个样式组成,它属于HTML网页代码的一部分,一般放在网页<head>中开始和关闭标签</head>之间。例如:
<style type="text/css">
h1{
color:#FF0000;
font-size:13px;
}
p{
color:blue;
font-family:Arial;
}
</style>
</head>
<body>
其中<style>标签式是属于HTML代码,不归属于
CSS代码,它的任务就是告诉Web浏览器:包围在<style>标签内的信息是CSS代码,而不是HTML代码。所以创建一个CSS内部样式表只要在<style>标签中写入一个或多个CSS样式就行了。
注意:优秀的Web
网页设计师通常是将CSS内部样式表放在关闭的</head>标签前面。但如果你在网页还是使用了JavaScript,就必须将JavaScript代码放在CSS样式表后。
虽然内部样式表放在HTML网页中,并能立即消失样式结果出来,但它并不是大多数网站的所选。因为,你要将内部样式表复制并粘贴到每个页面里,这太浪费精力,也使得网页代码容量增大,减缓网页运行速度。实际上,网站采用
外部样式表会比较好。因为它使创建网页变得更加容易,更新网站也变得更快。外部样式表将所有的样式信息放在单个文件中,然后用一行代码将它连接到HTML网页上。
前面讲解了CSS样式表中的
内部样式表,而
CSS外部样式表也只不过是将所有CSS规则放进了一个独立的文本文件中,它不包含任何HTML代码。它是由.css作为后缀扩展名。文件名则可以由您任取了,但最好能见名知意的文件名。例如:main.css、head.css、foot.css
但如果您的网页中已经有了一些CSS内部样式表,但想将它变成一个外部样式表。那么将<style>和</style>标签之间 的所有代码拷贝出来,然后创建一个新的后缀为.css的文件,将复制好的代码放在这个css文件即可。这样就成了两个独立的文件了,那我们怎么使网页和外 部样式表关联起来呢?