Menu
Coddy logo textTech

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ümler halinde düzenlemek için kullanılır.

<section> etiketi, bir belgedeki bölümleri; örneğin bölümleri, üst bilgileri, alt bilgileri veya belgenin diğer bölümlerini tanımlar. İlgili içeriği birlikte gruplandırmanın bir yoludur. Örneğin, bir sayfayı giriş, içerik ve iletişim bilgileri olarak bölmek için <section> kullanabilirsiniz.

<section> etiketini şöyle kullanabilirsin:

<section>
	<h2>Section Heading</h2>
	<p>Section content goes here.</p>
</section>

<article> etiketi bağımsız, kendi kendine yeterli içeriği belirtir. Kendi başına anlamlı olmalı ve web sitesinin geri kalanından bağımsız olarak okunabilmelidir. Bir <article> öğesinin kullanılabileceği yerlere örnekler: forum gönderisi, blog yazısı, haber veya yorum.

<article> etiketini nasıl kullanabileceğin aşağıda gösterilmiştir:

<article>
	<h2>Article Title</h2>
	<p>Article content goes here.</p>
</article>
challenge icon

Görev

Kolay

Bir web sayfasını yapılandırmak için <section> ve <article> etiketlerini kullanan bir HTML belgesi oluştur. Aşağıdaki bölümleri ekle:

  1. Sayfanın ana içeriğini barındıracak bir <main> bölümü.
  2. <main> içinde, "Upcoming Events" yazan bir başlığa (<h2>) sahip bir <section> oluştur.
  3. <section> içinde iki <article> öğesi oluştur.
  4. Her <article> bir başlığa (<h3>) ve bazı örnek metinler içeren 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..." ifadelerini kullan.

Kendin dene

<!DOCTYPE html>
<html>
    <body>
        <!-- Kodu buraya yaz -->
    </body>
</html>
quiz iconKendini test et

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

Kendi başına pratik yap: Web playground