Menu
Coddy logo textTech

Section ve Article Etiketleri

Coddy'nin HTML Journey'sinin Temeller 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

<section> ve <article> etiketlerini kullanarak bir web sayfasını yapılandıran bir HTML belgesi oluşturun. Aşağıdaki bölümleri ekleyin:

  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 (<section>) sahip bir <h2> oluşturun.
  3. <section> içinde iki <article> öğesi oluşturun.
  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 "Event 1 details..." ve "Event 2 details..." ifadelerini kullanın.

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.

Temeller bölümündeki tüm dersler

Kendi başına pratik yap: Web playground