如何删除表的所有继承的CSS格式?

时间:2009-06-09 08:41:12

标签: css inheritance css-tables

由于页面的CSS文件,我有一个具有某种风格的表格(它有蓝色边框等等)。

是否有一种简单的方法可以删除该特定表的CSS? 我正在思考类似命令的内容:

style="nostyle"

有这样的事吗?

4 个答案:

答案 0 :(得分:39)

试试这个。

来自Eric Meyer's Reset CSS

table, caption, tbody, tfoot, thead, tr, th, td {
    margin: 0;
    padding: 0;
    border: 0;
    outline: 0;
    font-size: 100%;
    vertical-align: baseline;
    background: transparent;
}

答案 1 :(得分:3)

使用CSS重置,例如YUI CSS reset

答案 2 :(得分:1)

在同时使用jqueryuitablesorter plugin的网站上查找tableorter表中的表格。虽然这里的一些答案有所帮助,但这还不够,特别是因为tablesorter使用:hover和jquery ui使用圆角等等。这就是我想出的:

我声明了一个类,当应用于表时会将其清理为一些合理的默认值。必须在其可能需要清理的任何其他类之前声明此css,即<link>或将其放在<style>部分顶部的<head>标记之前。

.defaulttable {
  display: table;
}
.defaulttable thead {
  display: table-header-group;
}
.defaulttable tbody {
  display: table-row-group;
}
.defaulttable tfoot {
  display: table-footer-group;
}
.defaulttable tbody>tr:hover,
.defaulttable tbody>tr {
  display: table-row;
}
.defaulttable tbody>tr:hover>td,
.defaulttable tbody>tr>td {
  display: table-cell;
}
.defaulttable,
.defaulttable tbody,
.defaulttable tbody>tr:hover,
.defaulttable tbody>tr,
.defaulttable tbody>tr:hover>td,
.defaulttable tbody>tr>td,
.defaulttable tbody>tr:hover>th,
.defaulttable tbody>tr>th,
.defaulttable thead>tr:hover>td,
.defaulttable thead>tr>td,
.defaulttable thead>tr:hover>th,
.defaulttable thead>tr>th,
.defaulttable tfoot>tr:hover>td,
.defaulttable tfoot>tr>td,
.defaulttable tfoot>tr:hover>th,
.defaulttable tfoot>tr>th {
  background: transparent;
  border: 0px solid #000;
  border-spacing: 0px;
  border-collapse: separate;
  empty-cells: show;
  padding: 0px;
  margin: 0px;
  outline: 0px;
  font-size: 100%;
  color: #000;
  vertical-align: top;
  text-align: left;
  font-family: sans-serif;
  table-layout: auto;
  caption-side: top;
  -webkit-border-radius: 0px;
  -moz-border-radius: 0px;
  border-radius: 0px;
  -webkit-background-clip: padding-box;
  -moz-background-clip: padding;
  background-clip: padding-box;
}

然后只需将该类应用于您想要“默认”的表:

<table class="defaulttable and whatever else you want">
  <tbody>
    <tr>
      <td>This will appear with sensible defaults.</td>
    </tr>
  </tbody>
</table>

答案 3 :(得分:0)

如果您想确保取消所有属性的CSS,可以使用以下内容:

#+BEGIN_SRC js
const chalk = require('chalk');

console.log(chalk.red('Hello world!'));
#+END_SRC

#+RESULTS:
: Hello world!
: undefined

table, caption, tbody, tfoot, thead, tr, th, td { all: unset; } 媒体资源上的MDN文档:https://developer.mozilla.org/en-US/docs/Web/CSS/all