CSS使用篇(三):创建CLASS

        以上所介绍的样式表规则，我们发现在一个HTML页中中，每种HTML标志只能为其定义一种风格，然而我们有时候会碰到其他一些情况，比如：同一个HTML标志需要呈现不同的风格；有若干个不同的HTML标志采用相同的样式规则。

　　
       采用上面提到的直接插入方式可以一一的对之进行定义，但这样做有个问题，一旦这类定义多了起来，又会使事情变得相当复杂，与我们采用样式表以求风格的统一和形式简单的初衷大相违背。

　　
样式表提供了解决方法，创建类（CLASS）可以创建同一个HTML标志的多种风格。

　　
其语法为：

　　
标志.类名{标志属性：属性值；标志属性：属性值；……标志属性：属性值}

　　
引用方法是：

　　 < 标志
CLASS="类名">

　　
例如，我们打算让某一些段落缩进0.5in，另一些段落缩进1.0in，我们知道段落采用< P>这个标记。

　　
代码书写如下：

< html>
< head>
< title>This is a sample< /title>
< style type="text/css">
< !--
p.first {  text-indent: 0.5in}
p.second {  text-indent: 1.0in}
-->
< /style>
< /head>
 
< body bgcolor="#FFFFFF">
……
< p class="first">这个段落将缩进0.5in< /p>
< p class="second">这个段落将比上面缩进一倍距离< /p>
……
< /body>
< /html>

　　
显示该页面时，第二个段落将比第一个段落多缩进出一倍距离。

　　
此外，可以直接定义CLASS，应用于HTML页面中的各个标记。其语法只是比上面的少了一个标志：

　　
.类名{标志属性：属性值；标志属性：属性值；……标志属性：属性值}

　　 例如：

< style type="text/css">
< !--
.main01 { font-size: 10pt; color: blue}
-->
< /style>

　　
该CLASS规定了字符的大小和颜色，当HTML文档中任何地方，无论是段落< p>、表格<
table>，需要其字体大小为10pt颜色为红色时，就可以引用这个CLASS。引用的方法和上面一样：

　　 <
HTML标志 CLASS="类名">

　　
例如要设置某单元格中的字符大小为main10所定义的风格，则可写为：

　　 < td
class="main01">

　　
而设置某一段落字符风格为main10，可写为：

　　 < p
class="main01">

　　
如上所举，我们可以在同一HTML文档中多次引用这个类，引用该类的地方都将呈现同一种风格。

　　
创建CLASS并不是建立多种风格的唯一手段， ID也可以用来实现同一规则被应用到页面中不同的地方。

　　
它的语法是：

　　 #id名
{标志属性：属性值；标志属性：属性值；……标志属性：属性值}

　　
如上面的例子，可以改写为：

　　 <
style type="text/css">

　　 < !--

　　 #001 { font-size: 10pt; color: red}

　　 #002 { font-size: 12pt; color: blue}

　　 -->

　　 < /style>

　　
引用的方法也相同：< 标志　ID＝"ID名">。