Yükleniyor...
Duyarlı HTML
Telefon, tablet, masaüstü aynı URL. Duyarlı sayfa uyum sağlar. HTML başlar; CSS biter.
Doğrudan yanıt
1) viewport meta head içinde
2) esnek genişlikler
3) img fluid
media query CSS'te.
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">Dene
- viewport meta
- geniş görsel + CSS
- pencereyi daralt
- sabit genişlikle karşılaştır
Kolay hatalar
- viewport unutmak
- sabit 1200px
- sadece HTML
Özet
- viewport şart
- fluid genişlik/görsel
- CSS media query
- küçük ekran erken
🧠 Bilginizi Test Edin
Başlamaya Hazır
Bilginizi Test Edin
Bu interaktif sınavla kendini test et ve konuyu ne kadar iyi anladığını gör
5
Sorular
70%
Geçmek İçin
∞
Süre
∞
Deneme
📝 Talimatlar
- Her soruyu dikkatle okuyun
- Her soru için en iyi cevabı seçin
- Quiz'i istediğiniz kadar tekrar alabilirsiniz
- İlerlemeniz üstte gösterilecek