Wie erfasst man einen Codeblock als PDF und behält gleichzeitig den CSS-Stil in einem Browser bei?

Hervorgehobenes Vorelement als PDF mit CSS-Erhaltung herunterladen

Um ein Vorelement als PDF zu speichern und dabei den CSS-Stil beizubehalten, können Sie a verwenden Methode, die das Öffnen eines neuen Fensters, das Einfügen von HTML und CSS und das Drucken in eine PDF-Datei umfasst.

Lösung:

1. Öffnen Sie ein neues Fenster und konzentrieren Sie sich it.
2. Hängen Sie den HTML-Code des pre-Elements und die erforderlichen CSS-Stile an den Dokumentkörper des neuen Fensters an.
3. Rufen Sie die .focus()-Methode im neuen Fenster auf.
4. Aufruf die .print()-Methode im neuen Fenster.
5. Wählen Sie im Druckdialog des Systems „In Datei drucken“ und speichern Sie das PDF.

Hier ist der jQuery-Code, den Sie verwenden können :

$("#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();
});

Das obige ist der detaillierte Inhalt vonWie erfasst man einen Codeblock als PDF und behält gleichzeitig den CSS-Stil in einem Browser bei?. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!