Lädt...
Responsives HTML
Handy, Tablet und Desktop teilen die URL. Eine responsive Seite passt sich an. HTML startet; CSS beendet.
Direkte Antwort
1) Viewport-meta in head
2) Flexible Breiten
3) img { max-width: 100%; height: auto; }
Media Queries sind CSS.
Viewport meta
html
HTML Code
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Responsive demo</title>
</head>
Fluid images helper
html
HTML Code
<style>
img { max-width: 100%; height: auto; }
</style>
<img src="images/wide.jpg" alt="Wide landscape photo">
Ausprobieren
- Viewport-meta prüfen
- Breites Bild + fluid CSS
- Fenster schmaler
- Mit festem width vergleichen
Typische Fehler
- Viewport vergessen
- Feste 1200px
- Nur HTML reicht
Zusammenfassung
- Viewport meta wichtig
- Flexible Breiten/Bilder
- Media Queries in CSS
- Kleinbildschirm früh
🧠 Testen Sie Ihr Wissen
Bereit zum Start
Testen Sie Ihr Wissen
Fordern Sie sich mit diesem interaktiven Quiz heraus und sehen Sie, wie gut Sie das Thema verstehen
5
Fragen
70%
Zum Bestehen
∞
Zeit
∞
Versuche
📝 Anweisungen
- Lesen Sie jede Frage sorgfältig
- Wählen Sie die beste Antwort für jede Frage
- Sie können das Quiz so oft wiederholen, wie Sie möchten
- Ihr Fortschritt wird oben angezeigt