首頁 > web前端 > css教學 > 將語法螢光筆預元素儲存為 PDF 時如何保留 CSS 樣式?

將語法螢光筆預元素儲存為 PDF 時如何保留 CSS 樣式?

Mary-Kate Olsen
發布: 2024-10-23 16:38:01
原創
746 人瀏覽過

How to Preserve CSS Styling When Saving Syntax Highlighter Pre Element as a PDF?

如何將語法螢光筆預元素儲存為PDF 保留CSS 樣式

將語法螢光筆預元素另存為PDF,同時維護CSS ,請考慮以下替代方法:

解決方案:

  1. 建立新視窗: 使用window 開啟新瀏覽器視窗.open ().
  2. 附加HTML 和CSS: 附加pre 元素($("#output")[0].outerHTML) 的HTML 內容和任何必要的CSS 樣式( $(" style")[0].outerHTML) 到新視窗的主體。
  3. 聚焦和列印: 在新視窗上呼叫 .focus() 和 .print() 。這將觸發系統列印對話框,允許您選擇「列印到檔案」將預先元素儲存為 PDF。

jQuery 實作:

<code class="javascript">$("#save").click(function() {
  var text = $("#output")[0].outerHTML;
  var styles = $("style")[0].outerHTML;
  var popup = window.open("", "popup");
  popup.document.body.innerHTML = text + styles;
  popup.focus();
  popup.print();
});</code>
登入後複製

示範:

以上是將語法螢光筆預元素儲存為 PDF 時如何保留 CSS 樣式?的詳細內容。更多資訊請關注PHP中文網其他相關文章!

來源:php
本網站聲明
本文內容由網友自願投稿,版權歸原作者所有。本站不承擔相應的法律責任。如發現涉嫌抄襲或侵權的內容,請聯絡admin@php.cn
作者最新文章
熱門教學
更多>
最新下載
更多>
網站特效
網站源碼
網站素材
前端模板