在不影响另一个html表的情况下,为html表使用css的最快方法

Question

我的css位于http://sillybean.net/css/seaglass.css,我想只使用这个css中的一个html表,在同一页面上我有多个html表,所以我不想影响其他html表.在http://sillybean.net/css/seaglass.css上进行较少修改的最快方法是什么？

Answer 1

你可以只将一个类应用于你想要影响的表,然后在CSS中使用该类吗？

在您的HTML中,您可以放置​​:

<table class="mytable">
... CONTENT OF THE TABLE, AS NORMAL ...
</table>

然后,将类选择器添加到CSS:

table.mytable { border-collapse: collapse; border: 1px solid #839E99;
                background: #f1f8ee; font: .9em/1.2em Georgia, "Times New Roman", Times, serif; color: #033; }
.mytable caption { font-size: 1.3em; font-weight: bold; text-align: left; padding: 1em 4px; }
.mytable td,
.mytable th { padding: 3px 3px .75em 3px; line-height: 1.3em; }
.mytable th { background: #839E99; color: #fff; font-weight: bold; text-align: left; padding-right: .5em; vertical-align: top; }
.mytable thead th { background: #2C5755; text-align: center; }
.mytable .odd td { background: #DBE6DD; }
.mytable .odd th { background: #6E8D88; }
.mytable td a,
.mytable td a:link { color: #325C91; }
.mytable td a:visited { color: #466C8E; }
.mytable td a:hover,
.mytable td a:focus { color: #1E4C94; }
.mytable th a,
.mytable td a:active { color: #fff; }
.mytable tfoot th,
.mytable tfoot td { background: #2C5755; color: #fff; }
.mytable th + td { padding-left: .5em; }