Question

当你用tinymce拉伸你的桌子时，你会得到这个

<table class="opbouw" style="width: 725px; height: 170px;" border="0" cellpadding="0" cellspacing="0">

但是，我希望它被覆盖，因为所有表格必须是100％宽度才能打印，否则它看起来很糟糕。

任何人都可以告诉我如何覆盖它，以便打印时表格是100％吗？

Answer 1

将!important规则应用于其末尾。

在您的CSS文件中：

table {
    width: 100% !important;
}

Answer 2

由于width与style属性内联，因此您无法覆盖它。 Sometimes not even !Important will override it.如果您可以将尺寸信息移动到某个类，则可以在打印样式表中将宽度重置为100％。

如果您不想将大小信息添加到类opbouw，那么您可以创建第二个类，例如narrowTable并将这两个类同时应用于表：

<table class="opbouw narrowTable" ...>

在您的打印样式表中，您可以重置尺寸属性：

<style type="text/css">
 @media print
 {
     TABLE, .narrowTable
     {
         width: 100%;
         margin: 0;
         padding: 0;
     }
  }

  @media screen
  {

     .opbouw
     {
     }

     .narrowTable
     {
         width: 725px;
         height: 150px;
         border: none;
     }

     /* all your normal screen styles */
  }
</style>

有关CSS Selector Specificty的更多信息（当多个样式指向同一个元素时获胜者），see this here，我在网上最喜欢的CSS文章。

如何覆盖表中的CSS样式

2 个答案: