Özet - İçindekiler tablosu
İç içe sıralı ve sırasız listelerle bir içindekiler tablosu oluşturursun.
Bu grupta öğrendiklerimiz
Bu grupta dört liste türünü gördün:
- Sırasız liste:
<ul>ve<li> - Sıralı liste:
<ol>iletypevestartöznitelikleri - Açıklama listesi:
<dl>,<dt>,<dd> - İç içe ve bağlantılı listeler
Şimdi bunları birleştirip sayfa içinde gezinmeyi kolaylaştıran bir içindekiler tablosu yapacağız.
Uygulama İçindekiler tablosu yap
Body içine bir <ul> içindekiler tablosu ekle. İki <li> olsun; her birinde bir <a href="#bolum-1"> ve <a href="#bolum-2"> ile sayfa içi bağlantı. Sonra iki başlık ekle: <h2 id="bolum-1">Bölüm 1</h2> ve <h2 id="bolum-2">Bölüm 2</h2>.
Örnek çözümü göster
<body>
<ul>
<li><a href="#bolum-1">Bölüm 1</a></li>
<li><a href="#bolum-2">Bölüm 2</a></li>
</ul>
<h2 id="bolum-1">Bölüm 1</h2>
<h2 id="bolum-2">Bölüm 2</h2>
</body>Kendini test et
-
Etiketi rolüyle eşleştir
- <ul>
- Sırasız liste kabı
- <ol>
- Sıralı liste kabı
- <dl>
- Açıklama listesi kabı
- <a href="#x">
- Sayfa içi bağlantı
- <h2 id="x">
- Çapa olacak başlık
-
Bir içindekiler tablosu temel olarak ne işe yarar?
- Sayfanın yüklenme süresini kısaltır
- Sayfanın arka plan rengini belirler
- Başlıklara hızlı geçiş sağlar
- Başlıkların yazı tipini değiştirir
Cevabı göster
Başlıklara hızlı geçiş sağlar — Doğru. İçindekiler tablosu, başlıklara tıklanabilir bağlantılarla hızlı geçiş sağlar.
-
Sayfa içi bağlantıyı yaz
<a href="____">Bölüm 1'e git</a>Cevabı göster
<a href="#bolum-1">Bölüm 1'e git</a>