Liste öğelerinde bağlantı
Menü ve içerik listeleri için <li> içine bağlantı yerleştirmeyi öğrenirsin.
Liste öğesinde bağlantı
Bir <li> öğesinin içine daha önce öğrendiğin <a> etiketini koyarak bağlantı oluşturursun. Örnek: <li><a href="about.html">Hakkında</a></li>.
Önemli sıra: <a> etiketi <li>'nin içinde olmalıdır. Tersi (<li>'yi <a>'nın içine koymak) geçersizdir; tarayıcı bunu yanlış yorumlar.
Navigasyon listesi
Bir sitenin üst menüsü genelde bir <ul> ve içinde bağlantılı <li> öğelerinden kurulur. Buna navigasyon listesi denir. Her öğe site içindeki bir sayfaya bağlantı taşır.
Örnek: Ana sayfa, Hakkında, İletişim öğelerini içeren bir menü. Görsel biçimlendirme CSS ile yapılır; HTML tarafında yalnızca yapı ve bağlantılar vardır.
Uygulama Üç bağlantılı menü yaz
Body içine bir <ul> menü ekle. Üç <li> öğesi olsun; her birinin içinde bir <a href="..."> bağlantı bulunsun. Örneğin Ana sayfa (index.html), Hakkında (about.html), İletişim (contact.html).
Örnek çözümü göster
<body>
<ul>
<li><a href="index.html">Ana sayfa</a></li>
<li><a href="about.html">Hakkında</a></li>
<li><a href="contact.html">İletişim</a></li>
</ul>
</body>Kendini test et
-
Bir bağlantı (<a>) liste öğesinde nasıl yazılır?
- <a><li>Bağlantı</li></a>
- <li><a href="x.html">Bağlantı</a></li>
- <li>Bağlantı</li><a href="x.html"></a>
- <a href="x.html"></a><li>Bağlantı</li>
Cevabı göster
<li><a href="x.html">Bağlantı</a></li> — Doğru. a, li'nin içine yazılır; tersi geçersizdir.
-
Bağlantıya hedef ver
<li><a ____>Ana sayfa</a></li>Cevabı göster
<li><a href="index.html">Ana sayfa</a></li> -
Özniteliği rolüyle eşleştir
- href
- Bağlantının hedefi
- target
- Bağlantının nerede açılacağı
- rel
- Sayfalar arası ilişki
- id
- Sayfa içi çapa için kimlik