原文地址：http://rjx.cslg.cn/~ben/webapp/ref/html/CSS/html/css2.htm
四种结合方法：
（1）在HTML文档的<head>标记符内嵌入样式表的定义；
（2）使用<link>标记符链接到外部的样式表单；
（3）使用CSS的@import标记符来导入样式表单；
（4）在HTML文件中直接加入样式表的定义。
1.在HTML文件的<head>标记符内嵌入样式表的定义
格式：
|
<html>
<head>
<title>CSS范例9</title>
<style type=“text/css”>
<!--
body{
font-family:隶书;
font-size:40pt;
color:blue
}
-->
</style>
</head>
<body>
<center>
这是在HTML文件的<head>标记符内嵌入样式表的定义
</center>
</body>
</html>
|
<head>
<title>CSS范例9</title>
<style type=“text/css”>
<!--
body{
font-family:"隶书";
font-size:"40";
color:blue
}
-- >
</style>
</head>
|
|
|
注意：
①防止浏览器将<style>和</style>标签间的CSS风格叙述当成普通字符串，最好将其插入“<!--”和“--
>”之间。
②<style>标记符必须放在<head>标签内。
③在指定值的前后通常加上双引号，若值是英文字母、数字、减号或小数点时，双引号可以省略。
2.使用<link>标记符链接到外部的样式表单
<link>标记符的属性：
（1）rel属性：用以规定被链接文件的关系，在样式表文件的情况下，REL的属性值永远是“stylesheet”
（2）type属性：用以规定链接文件的mime类型，具有唯一值“textcss”
（3）href属性：用以引用链接样式表文件（CSS文件）
|
<html>
<head>
<title>CSS范例9</title>
<link rel="stylesheet" href="link.css"
type="text/css">
</head>
<body>
<center>
这是使用<link>标记符链接到外部的样式表单
</center>
</body>
</html>
|
link.css的代码如下：
body{
font-family:"隶书";
font-size:"40";
color:blue
}
|
|
|
3.使用CSS的@import标记符来导入样式表单
格式：@import url(“文件名.css”);
|
<html>
<head>
<title>CSS范例11</title>
<style type="text/css">
<!--
@import url("link.css");
-->
</style>
</head>
<body>
<center>
这是使用CSS的@import标记符来导入样式表单
</center>
</body>
</html>
|
link.css的代码如下：
body{
font-family:"隶书";
font-size:"40";
color:blue
}
|
|
|
4.在HTML文件中直接加入样式表的定义
语法：<标签
style=样式表的定义>内容</标签>
|
<html>
<head>
<title>CSS范例12</title>
</head>
<body>
<h2><a
style="font-family:arial;font-style:italic;font-size:28pt;color:red">"超文本标记语言与层叠样式表"</a>是用行内定义的CSS样式加以突出。</h2>
</body>
</html>
|
<a
style="font-family:arial;font-style:italic;font-size:28pt;color:red">
|
|
|
加载中…
顶