[英]wkhtmltopdf exclude css files from PDF but show in HTML
I was working with wkhmtltopdf and found that I have a problem with it. 我在使用wkhmtltopdf时发现它有问题。 I am using the html page to also preview the content in a browser prior to converting to PDF. 在转换为PDF之前,我还使用html页面在浏览器中预览了内容。
But to make it more readable in my preview, I have added some css on the page: (In javascript/jQuery on document ready) 但是为了使它在预览中更具可读性,我在页面上添加了一些CSS :(在javascript / jQuery中准备好文档)
$(document).ready(function () {
if(window.location.href.indexOf("preview") > -1 && window.location.href.indexOf(".pdf") == -1) {
appendCSStoHtml();
}
});
function appendCSStoHtml() {
$("body").css({"background-color":" #F0F8FF"});
$("#previewHtml").css({
"margin-left":"15%",
"margin-right":"15%",
"margin-top":"15px",
"max-width":"1024px"});
$("#previewHtml > h2").css({"margin-left":" 15px"});
}
So this is all good and dandy, but when I generate my PDF based on this HTML page, then the css is also renderend inside my PDF and the outlining and background are also present inside the PDF. 因此,这一切都很好,但当我基于此HTML页面生成PDF时,css也同时在我的PDF中渲染,并且轮廓和背景也出现在PDF中。
I don't want this to happen, I only want my css style elements to be renderen on the HTML page and not inside the PDF. 我不希望这种情况发生,我只希望将css样式元素呈现在HTML页面而不是PDF内部。
How can I achieve this? 我该如何实现?
I tried with the following: 我尝试了以下方法:
$(document).ready(function () {
if(window.location.href.indexOf("preview") > -1 && window.location.href.indexOf(".pdf") == -1) {
appendCSStoHtml();
}
});
But that did not matter. 但这没关系。
Any ideas? 有任何想法吗?
it's me again. 又是我。
Not sure if there is something that resembles what I am looking for. 不知道是否有与我要找的东西相似的东西。 Thus I made my own. 因此,我做了我自己的。
I added a page parameter and check this in the code to see if it's true
or false
: 我添加了一个page参数,并在代码中检查了此参数以查看它是true
还是false
:
<script type="text/javascript">
$(document).ready(function () {
var url_string = window.location.href;
var url = new URL(url_string);
var renderCss = url.searchParams.get("renderCss");
if(renderCss == 'true') {
appendCSStoHtml();
}
});
function appendCSStoHtml() {
$("body").css({"background-color":" #F0F8FF"});
$("#previewHtml").css({
"margin-left":"15%",
"margin-right":"15%",
"margin-top":"15px",
"max-width":"1024px"});
$("#previewHtml > h2").css({"margin-left":" 15px"});
}
</script>
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.