Question

我使用PrintThis Jquery插件我使用Bootstrap作为我的框架。

使用PrintThis进行打印时，我想降低字体大小我刚刚在doc中做了样式更改。像这样：

<style>
body {
    font-size: 8px;
    line-height: 1.42857143;
}
</style>

当页面首次加载时。所有文字都是8px 但是当我按下PrintThis按钮时，页面会将所有文本重新加载/更改为Bootstrap默认的14px。那是为什么？

适用于printButton的HTML

<button class="btn btn-default pull-right" id="print_btn"><span class="glyphicon glyphicon-print" title="Print"></span></button>

JS for printThis

<script>
$(document).ready(function () {
    $('#print_btn').click(function () {
      $('#usr_name, #list_usr_time, #sum_worked_time,  #break_page').printThis();
    });
});
</script>

UPPDATE 我将样式从页面移动到CSS文件中然后我将css文件加载到页面中我还添加了：loadCSS：“css / custom_printthis.css”，自定义Jquery 结果是，页面不会覆盖css。文字是8px，就像我想要的那样。但是，当我按下Print时，预览会在表格标签内显示14px文本，并在外面显示8px文本。 Maby我需要在我的CSS中添加“table.tex”...

Answer 1

为了解决这个问题，我为php打印的所有文本创建了一个新类然后我为该类创建了一个CSS文件，并覆盖了Bootstrap的原始字体大小。

<td class="table_text">Text</td>

.table_text{
    font-size: 10px;
}

PrintThis按下按钮时覆盖自定义CSS

1 个答案: