HTML-Tag <dialog> als Modal-Ersatz

Das <dialog>-Element stellt ein modales oder nicht-modales Dialogfenster dar (z. B. Bestätigungsdialog, Formular, Hinweis). Es bietet native Methoden (show(), showModal(), close()), ein ::backdrop-Pseudo-Element und vereinfacht zugängliche Modals, wenn richtig eingesetzt. MDN Web Docs 1. Definition & Zweck 2. Grundsyntax & Attribute Attribut / Eigenschaft Bedeutung open HTML-Attribut. Wenn gesetzt, ist der Dialog sichtbar (nicht unbedingt … Weiterlesen

HTML-Attribut „popover“ zeigt/verbirgt Elemente

1. Einordnung & Zweck 2. Attributwerte & Verhalten Wert Beschreibung / Verhalten auto (Standard) Popover kann „light dismiss“ — d. h. durch Klick außerhalb oder durch Esc geschlossen werden. Öffnen eines neuen auto-Popovers schließt ggf. andere auto-Popovers (außer verschachtelten). (MDN Web Docs) manual Popover schließt nicht automatisch und reagiert nicht auf Klick außerhalb. Steuerung ausschließlich … Weiterlesen

CSS-Pseudo-Elemente

1. Was sind Pseudo-Elemente? Ein Pseudo-Element ist ein virtuelles Kind eines existierenden Elements, mit dem man bestimmte Teile eines Elements gestalten kann, etwa: Sie werden in CSS mit zwei Doppelpunkten (::) notiert — Single-Colon (:) wird historisch noch unterstützt für einige alte Pseudo-Elemente. MDN Web Docs 2. Wichtige Pseudo-Elemente & ihre Verwendung Pseudo-Element Beschreibung Typische … Weiterlesen

Kategorien CSS Schlagwörter

Übersicht: Visual Studio Code – Tastenkürzel

Bereich Shortcut Beschreibung Allgemein / UI ⇧⌘P Öffne Command Palette (führt viele Befehle aus) (Rost Glukhov) ⌘P Schnelldatei öffnen („Quick Open“) (DevSheets) ⌘, Einstellungen öffnen („User Settings“) (DevSheets) ⌘K ⌘S Tastenkürzel Übersicht öffnen (Keyboard Shortcuts Editor) (Visual Studio Code) ⌘B Seitenleiste (Sidebar) ein-/ausblenden (Visual Studio Code) ⌘„ (Backtick) Terminal anzeigen/verbergen (DevSheets) Maus-Multi-Cursor ⌥ + click … Weiterlesen

Übersicht: Formulare erstellen

HTML-Formulare existieren seit den frühen 1990er Jahren. Anfangs waren sie schlicht, mit nur Textfeldern, Buttons und Checkboxen. Mit HTML4 kamen neue Input-Typen, die Validierung erleichterten. HTML5 führte spezialisierte Typen (email, date, range) und Elemente wie <datalist> oder <output> ein, um nutzerfreundliche, interaktive Formulare ohne externe Skripte zu ermöglichen. Heute sind Formulare zentral für Web-Interaktionen. HTML-Formulare … Weiterlesen

Die unterschiedlichen Einheiten im CSS

In den letzten Jahrzehnten hat sich das CSS-Einheitensystem stark weiterentwickelt. Anfangs dominierten absolute Einheiten wie px und pt. Mit dem Aufkommen von Responsive Design wurden relative Einheiten wie em, rem, % und Viewport-Einheiten (vw, vh) entscheidend. Neuere Varianten (dvh, vi, vb) ermöglichen heute flexiblere, kontextbewusste Layouts für verschiedene Geräte und Umgebungen. Die folgende Übersicht zu … Weiterlesen