HTML Iframe Generator
Bettet eine externe Seite (z.B. YouTube, Google Maps) ein.
Anwendung & Beispiele
Für Barrierefreiheit immer title setzen. sandbox isoliert die eingebettete Seite (z.B. sandbox="allow-scripts allow-same-origin").
FAQ
Was sind die Sicherheits-Risiken eines <iframe>?
Eingebettete Seiten können (je nach Origin) Zugriff auf den umgebenden Kontext erlangen — Clickjacking-Gefahr. Mit sandbox isolierst du das Iframe (z.B. sandbox="allow-scripts"). Cross-Origin-Iframes haben automatisch eingeschränkten Zugriff.
Wie kommuniziere ich zwischen Eltern- und Iframe-Seite?
Per window.postMessage() API — sicherer als direkter Property-Zugriff. Beide Seiten lauschen auf message-Events und prüfen event.origin.
Wie mache ich ein Iframe responsive?
Aspect-Ratio-Container: .video-wrap { aspect-ratio: 16/9; } .video-wrap iframe { width: 100%; height: 100%; }. Funktioniert in modernen Browsern; Fallback per Padding-Trick (56.25% bei 16:9).
Wofür sind ID, Class und Title?
id identifiziert ein Element eindeutig (für CSS, JS, Anker-Links). class erlaubt CSS-Styling, mehrere Klassen werden mit Leerzeichen getrennt. title erzeugt einen Tooltip beim Hover.
Funktioniert der Code in allen Browsern?
Alle hier erzeugten Elemente sind valides HTML5 und werden in allen modernen Browsern (Chrome, Firefox, Safari, Edge, Opera) unterstützt. Bei sehr alten Browsern (z.B. IE 11) kann es bei einzelnen Input-Typen wie color oder date Einschränkungen geben.