Section ve Article Etiketleri
Coddy'nin HTML Journey'sinin Fundamentals bölümünün bir parçası — ders 28 / 60.
HTML'de, <section> ve <article> etiketleri içeriği mantıksal bölümlere ayırmak için kullanılır.
<section> etiketi; bölümler, üst bilgiler, alt bilgiler veya belgenin diğer bölümleri gibi bir belgedeki bir bölümü tanımlar. İlgili içeriği bir araya getirmenin bir yoludur. Örneğin, bir sayfayı giriş, içerik ve iletişim bilgileri olarak ayırmak için <section> etiketini kullanabilirsiniz.
İşte <section> etiketini şu şekilde kullanabilirsiniz:
<section>
<h2>Section Heading</h2>
<p>Section content goes here.</p>
</section><article> etiketi bağımsız, kendi kendine yeten içeriği belirtir. Kendi başına bir anlam ifade etmeli ve web sitesinin geri kalanından bağımsız olarak okunabilmelidir. Bir <article> öğesinin kullanılabileceği yerlere örnekler: bir forum gönderisi, bir blog girişi, bir haber hikayesi veya bir yorum.
İşte <article> etiketini şu şekilde kullanabilirsiniz:
<article>
<h2>Article Title</h2>
<p>Article content goes here.</p>
</article>Görev
KolayBir web sayfasını yapılandırmak için <section> ve <article> etiketlerini kullanan bir HTML belgesi oluşturun. Aşağıdaki bölümleri ekleyin:
- Sayfanın ana içeriğini tutmak için bir
<main>bölümü. <main>içinde, "Upcoming Events" diyen bir başlığa (<h2>) sahip bir<section>oluşturun.<section>içinde, iki adet<article>öğesi oluşturun.- Her bir
<article>bir başlığa (<h3>) ve bir paragrafa (<p>) sahip olmalıdır. Başlıklar için "Event 1" ve "Event 2", paragraflar için ise "Event 1 details..." ve "Event 2 details..." kullanın.
Kopya kağıdı
<section> etiketi, ilgili içeriği bir araya getirmek için bir belgedeki bir bölümü tanımlar:
<section>
<h2>Section Heading</h2>
<p>Section content goes here.</p>
</section><article> etiketi, kendi başına anlam ifade etmesi gereken bağımsız, kendi kendine yeten içeriği belirtir:
<article>
<h2>Article Title</h2>
<p>Article content goes here.</p>
</article>Kendin dene
<!DOCTYPE html>
<html>
<body>
<!-- Kodunuzu buraya yazın -->
</body>
</html>Bu ders kısa bir quiz içerir. Soruları yanıtlamak ve ilerlemeni kaydetmek için derse başla.
Fundamentals bölümündeki tüm dersler
1HTML Temelleri
HTML Nedir?HTML'in Temel YapısıEtiketler ve Elementlerİç İçe Geçirme ve Kapatma EtiketleriHTML'de Yorumlar7Kişisel Profil Sayfası
Projeye Genel BakışHeader Bölümü2Metin ve Biçimlendirme
BaşlıklarParagraflarSatır SonlarıKalın ve İtalik MetinYeniden Kalın ve İtalikÖzet - Biçimlendirme8Formlar ve Inputlar Bölüm 1
Form TemelleriMetin InputlarıInput ÖznitelikleriŞifre AlanıInputlar için EtiketlerÖzet - Temel Form11Etkinlik Kayıt Sayfası
Projeye Genel BakışHeader Bölümü9Formlar ve Girdiler Bölüm 2
Radyo DüğmeleriOnay KutularıAçılır MenülerButonlarFormlardaki ButonlarÖzet - Formlar #1Özet - Formlar #212Final Meydan Okumaları
Basit Profil KartıEtkinlik Davetiye KartıBasit Makale SayfasıFavori Kitaplar Listesi