否则你写在一个页面里的两个样式若有重复，则只有后面的定义起作用，例如宽度。
最严重的是，你所画的所有引用该样式的页面的所有table都是一个样子。
第一个:
table.table_A{width:100%border:noneborder-collapse:collapse}
table.table_A td{border:none}
第二个：
table.table_B{width:980margin:autoborder:noneborder-collapse:collapse}
table.table_B td{border:none}
table： 会作为块级表格来显示（类似 <table>）
table-row： 浏览器会默认创建一个表格行（类似<tr>）
table-cell： 作为一个表格单元格显示（类似 <td>和 <th>）
具体实现
结果：
左边宽度固定，右边自适应
结果：
结果：
结果：
我们要 <div class="box">B</div>" 整个可以使用 text-align: right 属性，也就是整个B框要在红色背景的右边，需要先将他们设置 inline-block 属性
结果：
