css学习笔记（二）
13，编写头部的css
因为要将css文件定义在HTML文件头部的方法为内部样式表方法，所以下面举例说明怎么应用内部样式表方法在HTML文件的头部编写css
（1）打开记事本，在记事本中输入如下一段普通的HTML代码，然后将代码文件以扩展名.html的形式保存
实例代码：
-
<
html
>
??
-
<
head
>
??
-
????<
title
>
编写头部css文件
</
title
>
??
-
</
head
>
??
-
<
body
>
??
-
????<
h3
?
align
=
"center"
>
??
-
????编写头部css文件??
-
????</
h3
>
??
-
????<
p
>
??
-
????在HTML文件的头部应用内部样式表方法添加css??
-
????</
p
>
??
-
</
body
>
??
-
</
html
>
??
（2）在上面代码中的<head>与</head>之间插入如下代码
-
<
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
实例代码：
-
<
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文件的代码。
-
<
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文件上
实例代码：
-
<
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文件
实例代码：
-
<
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文件中调用它
-
h1{color:blue;?font-size:30px;?font-family:黑体}??
-
p{background:pink;?color:black;?font-size:20;?font-family:宋体}??
（3）在浏览器中天打开上面建立的HTML文件，查看代码的显示效果
?