文章/答案/技术大牛

发布

社区首页 >问答首页 >HTML -打印页不检索CSS

问HTML -打印页不检索CSS
EN

Stack Overflow用户

提问于 2017-09-23 15:30:48

回答 2查看 37关注 0票数 0

我试图在加载页面时打印一个页面，并且我一直试图使用@media print在CSS中打印页面，但是无论我做什么，我都无法让它工作。

我唯一需要做的就是在<th>标签中应用颜色。

HTML代码：

<body onload="window.print();">

<div>
  <h2 class="text-center"><span class="label label-default">Order Form Details</span></h2><br>
  <table class="table table-hover table-responsive">
    <thead>
      <tr>
        <th>Name</th>
        <th>Surname</th>
        <th>Telephone</th>
        <th>Postal Code</th>
        <th>Priority</th>
      </tr>
    </thead>
    <tbody>
    <tr>
        <td>1</td>
        <td>1</td>
        <td>1</td>
        <td>1</td>
        <td>1</td>
      </tr>
    </tbody>
  </table>
</div>

</body>

CSS代码：

th {
   background-color: #C8C8C8;
}

JSFiddle 这里

javascript

html

css

printing

回答 2

Stack Overflow用户

回答已采纳

发布于 2017-09-23 16:23:47

这取决于浏览器设置，但大多数浏览器默认不会打印背景色(您可以将其设置为“做”，但只能在浏览器本身，即打开页面的用户中打印)，而且默认情况下不能强迫它们这样做，因为它是网站代码对其没有影响的浏览器设置。

如果您绝对需要它，您必须将其编码为img标记，并将其放在DIV后面。

票数 1

Stack Overflow用户

发布于 2017-09-23 15:36:30

您可以在css中使用@media打印

.table th {
   background-color: #C8C8C8;
   -webkit-print-color-adjust: exact; 
}

@media print {
  .table th { background-color: #C8C8C8 !important; }
}

票数 1

页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持

原文链接：

https://stackoverflow.com/questions/46381236

复制

相似问题

问HTML -打印页不检索CSS
EN

回答 2

Stack Overflow用户

Stack Overflow用户

社区

活动

圈层

关于

腾讯云开发者

热门产品

热门推荐

更多推荐

问HTML -打印页不检索CSSEN

回答 2

Stack Overflow用户

Stack Overflow用户

社区

活动

圈层

关于

腾讯云开发者

热门产品

热门推荐

更多推荐

问HTML -打印页不检索CSS
EN