CSS，层叠样式表的作用是什么？我们先通过一个例子来体会一下：
看代码：
index.html
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="content-type" content="text/html; charset=gb2312" />
<link href="style.css" rel="stylesheet" type="text/css" />
<title>级联样式表测试</title>
</head>
<body>
<div class="div-style">
<table class="table-style">
<caption>使用CSS的表格范例</caption>
<thead>
<tr>
<th>列1</th>
<th>列2</th>
<th>列3</th>
<th>列4</th>
<th>列5</th>
</tr>
</thead>
<tbody>
<tr class="single-line">
<td>单元格1-1</td>
<td>单元格1-2</td>
<td>单元格1-3</td>
<td>单元格1-4</td>
<td>单元格1-5</td>
</tr>
<tr class="double-line">
<td>单元格2-1</td>
<td>单元格2-2</td>
<td>单元格2-3</td>
<td>单元格2-4</td>
<td>单元格2-5</td>
</tr>
<tr class="single-line">
<td>单元格3-1</td>
<td>单元格3-2</td>
<td>单元格3-3</td>
<td>单元格3-4</td>
<td>单元格3-5</td>
</tr>
<tr class="double-line">
<td>单元格4-1</td>
<td>单元格4-2</td>
<td>单元格4-3</td>
<td>单元格4-4</td>
<td>单元格4-5</td>
</tr>
<tr class="single-line">
<td>单元格5-1</td>
<td>单元格5-2</td>
<td>单元格5-3</td>
<td>单元格5-4</td&g
