css学习笔记（二） .
13，编写头部的css
因为要将css文件定义在HTML文件头部的方法为内部样式表方法，所以下面举例说明怎么应用内部样式表方法在HTML文件的头部编写css
（1）打开记事本，在记事本中输入如下一段普通的HTML代码，然后将代码文件以扩展名.html的形式保存
实例代码：
view plaincopy to clipboardprint?
01.<html>
02.<head>
03. <title>编写头部css文件</title>
04.</head>
05.<body>
06. <h3 align="center">
07. 编写头部css文件
08. </h3>
09. <p>
10. 在HTML文件的头部应用内部样式表方法添加css
11. </p>
12.</body>
13.</html>
<html>
<head>
<title>编写头部css文件</title>
</head>
<body>
<h3 align="center">
编写头部css文件
</h3>
<p>
在HTML文件的头部应用内部样式表方法添加css
</p>
</body>
</html>
（2）在上面代码中的<head>与</head>之间插入如下代码
view plaincopy to clipboardprint?
01.<style type="text/css">
02.<!--
03. h3{color:black; font-size:35px; font-family:黑体}
04. p{background:yellow; color:red; font-family:宋体}
05.-->
06.</style>
<style type="text/css">
<!--
h3{color:black; font-size:35px; font-family:黑体}
p{background:yellow; color:red; font-family:宋体}
-->
</style>
（3）保存后在浏览器中打开文件，需要注意的是文件的扩展名必须保存为.html格式
14，编写主体的css
将css文件定义在HTML文件主体的方法为嵌入样式表方法，下面举例说明怎么应用嵌入样式表方法在HTML文件的主体编写css
实例代码：
view plaincopy to clipboardprint?
01.<html>
02.<head>
03. <title>编写主体css文件</title>
04.</head>
05.<body>
06. <center>
07. <h1 style="color:green; font-size:35px; font-family:黑体">
08. 编写主体css文件
09. </h1>
10. </center>
11. <hr>
12. <p style="backgrount:cyan; color:red; font-size:25; font-family:隶书">
13. 在HTML文件的主体应用嵌入样式表方法添加css
14. </p>
15.</body>
16.</html>
<html>
<head>
<title>编写主体css文件</title>
</head>
<body>
<center>
<h1 style="color:green; font-size:35px; font-family:黑体">
编写主体css文件
</h1>
</center>
<hr>
<p style="backgrount:cyan; color:red; font-size:25; font-family:隶书">
在HTML文件的主体应用嵌入样式表方法添加css
</p>
</body>
</html>
15，编写外部的css---应用链入外部样式表方法在HTML文件内调用外部定义的css文件
（1）打开记事本，输入如下一段css文件的代码。
view plaincopy to clipboardprint?
01.<style type="text/css">
02.<!--
03. h3{color:black; font-size:35px; font-family:黑体}
04. p{backgroud:orange; color:blue; font-size:25; font-family:隶书}
05.-->
06.</style>
<style type="text/css">
<!--
h3{color:black; font-size:35px; font-family:黑体}
p{backgroud:orange; color:blue; font-size:25; font-family:隶书}
-->
</style>
（2）建立一个新的HTML文件，并连接到上面定义的css文件上
实例代码：
view plaincopy to clipboardprint?
01.<html>
02.<head>
03. <title>编写外部css文件</title>
04. <link rel=stylesheet type="text/css" href="1.css">
05.</head>
06.<body>
07. <h3 align="center">
08. 编写外部css文件
09. </h3>
10. <p>
11. 在HTML文件应用链入外部样式表方法调用外部的css
12. </p>
13.</body>
14.</html>
<html>
<head>
<title>编写外部css文件</title>
<link rel=stylesheet type="text/css" href="1.css">
</head>
<body>
<h3 align="center">
编写外部css文件
</h3>
<p>
在HTML文件应用链入外部样式表方法调用外部的css
</p>
</body>
</html>
（3）打开网页显示效果
16，编写外部的css----应用导入外部样式表方法在HTML文件内调用外部定义的css文件
（1）建立如下的HTML文件
实例代码：
view plaincopy to clipboardprint?
01.<html>
02.<head>
03. <title>编写外部css文件</title>
04. <style style="text/css">
05. @import url(1.css);
06. </style>
07.</head>
08.<body>
09. <h1 align="center">
10. 编写外部css文件
11. </h1>
12. <hr>
13. <p>
14. 在HTML文件中应用导入外部样式表方法调用外部css
15. </p>
16.</body>
17.</html>
<html>
<head>
<title>编写外部css文件</title>
<style style="text/css">
@import url(1.css);
</style>
</head>
<body>
<h1 align="center">
编写外部css文件
</h1>
<hr>
<p>
在HTML文件中应用导入外部样式表方法调用外部css
</p>
</body>
</html>
（2）再建立单独的css文件，代码如下
在实际应用过程中，HTML文件和css文件编写的先后顺序是很灵活的，但较多人倡导先编写好css文件，然后在HTML文件中调用它
view plaincopy to clipboardprint?
01.h1{color:blue; font-size:30px; font-family:黑体}
02.p{background:pink; color:black; font-size:20; font-family:宋体}
h1{color:blue; font-size:30px; font-family:黑体}
p{background:pink; color:black; font-size:20; font-family:宋体}
（3）在浏览器中天打开上面建立的HTML文件，查看代码的显示效果
A B C D E F G H I J K L M N O P Q R S T U V W X Y Z
