首先,先来看一下css在html中是如何应用的.有四种方法:
1.包含在<head>..</head>中,例如:
<head>
<style type="text/css">
<!--
 h1 
{
  font-size
:14px;
  color
:blue;
 
}-->
</style>
</head>
<body>
<h1>在这里使用了H1标签</h1>
</body>

2.行间定义,如:
  <body>
  <h1 style="font-size:14px;color:blue">在这里使用了H1标签</h1>
  </body>
3.外部调用文件如:
  <head>
  <link ref="stylesheet" href="example.css">
  </style>
4.倒入样式文件 如:
  <head>
  <style type="text/css">
  <!--
 @import url("http://domain/example.css");
  -->
  </head>
其次:再让我们看看css的分类:
  假定我们有几段文字,且我们要它第一行是红色,第二行是兰色,第三行是绿色..其实这很容易办到,我们在css中如下为每一行定义一个类:
  p.first{color:red;} p.second{color:blue;} p.third{color:green;}
  <p class="first">第一行的文字,使用的是class='first'</p>
  <p class="second">第二行的文字,使用的是class='second'</p>
  <p class="third">第三行的文字,使用的是class='third'</p>
重点:
1. 上面我们定义的类的前面都有一个p,也就限制了这个类只能在<p>标签中起作用,如果我们在定义的时候去掉了p,但.仍然要保留,比如
   .first{color:red;},这样定义的类就更灵活,可以用于任何html标签,例如:<h2 class="first">在H2标记中使用class='first'</h2>
2. 选择符ID #
   其实class只是一个类的选择符,另一个选择符ID具有同样的功能,不过使用ID选择符的类定义时要将.转化成#,使用时要在类别名上加上引号.
   例如:H1 #first{color:red;}
 #second{color:blue;}
 使用:<H1 ID="first">h1标记使用first类</h1>
 <h2 ID="second">h2标记使用second类</h2>
 <p ID="second">p标记使用的second类</p>


http://www.itta.cn/web/css/638.html
Posted on 2007-03-02 10:47  李通通  阅读(500)  评论(0编辑  收藏  举报