HTML-Viewer
HTML-Vorschau im Frame.
Über dieses Tool
Der Viewer zeigt ein HTML-Fragment in einem iframe mit Sandbox, sodass Sie die Struktur ohne eigene Datei beurteilen können. Skripte bleiben abgeschottet: Es ist eine Markup-Vorschau, keine Ausführung einer vollständigen Anwendung.
So nutzen Sie es
Fügen Sie das Fragment ein, starten Sie die Vorschau und betrachten Sie den Rahmen. Praktisch für E-Mail-Bausteine oder statische Komponentenskizzen, die Sie kurz prüfen wollen.
Beispiel
Das Beispiel nutzt Inline-Styles, damit sofort etwas sichtbar wird.
Eingabe
<article style="font-family:system-ui;padding:1rem">
<h1 style="margin:0 0 .5rem">Preview card</h1>
<p style="margin:0;color:#334155">Sandboxed HTML viewer example.</p>
</article>Ausgabe
(rendered in the preview frame)Tipp
Wirkt die Vorschau nackt, fehlte dem Fragment wohl ein externes Stylesheet, das der Rahmen nicht lädt.
Gut zu wissen
Laufen Skripte in der Vorschau?
Nein. Der Frame ist ohne Skript-Berechtigung isoliert und zeigt nur Markup und CSS. Testen Sie Verhalten auf einer echten Seite.
Erscheinen Tailwind-Klassen in der Vorschau?
Nicht automatisch: Der Frame hat kein Stylesheet, Utility-Klassen bewirken also nichts, bis Sie ein <link> auf kompiliertes CSS einfügen oder es in einen <style>-Block legen. Das Tailwind-Play-CDN-Skript kann nicht laufen, weil Skripte blockiert sind.