css学习笔记（二）

saybody

浏览: 907572 次
性别:
来自: 西安

最近访客更多访客>>

morelily

juzhibest

u012363178

wangyy

博主相关

博客

微博

相册

留言

关于我

文章分类

全部博客 (1052)

社区版块

存档分类

13，编写头部的css

因为要将css文件定义在HTML文件头部的方法为内部样式表方法，所以下面举例说明怎么应用内部样式表方法在HTML文件的头部编写css

（1）打开记事本，在记事本中输入如下一段普通的HTML代码，然后将代码文件以扩展名.html的形式保存

实例代码：

view plain

<
html
>
  
<
head
>
  
    <
title
>
编写头部css文件
</
title
>
  
</
head
>
  
<
body
>
  
    <
h3
 
align
=
"center"
>
  
    编写头部css文件  

    </
h3
>
  
    <
p
>
  
    在HTML文件的头部应用内部样式表方法添加css  

    </
p
>
  
</
body
>
  
</
html
>

（2）在上面代码中的<head>与</head>之间插入如下代码

view plain

<
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 plain

<
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 plain

<
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 plain

<
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 plain

<
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 plain

h1{color:blue; font-size:30px; font-family:黑体}  

p{background:pink; color:black; font-size:20; font-family:宋体}

（3）在浏览器中天打开上面建立的HTML文件，查看代码的显示效果

1
顶

1
踩

分享到：

css学习笔记（一） | css学习笔记（四）

2011-07-22 13:45
浏览 976
评论(0)
分类:编程语言
查看更多

发表评论

您还没有登录,请您登录后再发表评论

最近访客更多访客>>

博主相关

文章分类

社区版块

存档分类

最新评论