Ostatnio edytowany:

Granica sekcji zawartości nieokreślonego typu

Autor: Virtual Patriot

Każdy element HTML tworzący sekcję zawartości nieokreślonego typu posiada swoją własną granicę.

Dostrzegając granicę poszczególnych sekcji zawartości nieokreślonego typu możemy dostrzec, które elementy HTML należą do poszczególnej sekcji zawartości nieokreślonego typu.

Przykład:

<!-- POCZĄTEK PIERWSZEJ SEKCJI ZAWARTOŚCI NIEOKREŚLONEGO TYPU -->
<h1>Mój ulubiony kolor</h1>

<p>
  Moim ulubionym kolorem jest kolor błękitny.
</p>

<p>
  Ponieważ błękitny to kolor nieba.
</p>
<!-- KONIEC PIERWSZEJ SEKCJI ZAWARTOŚCI NIEOKREŚLONEGO TYPU -->

<!-- POCZĄTEK DRUGIEJ SEKCJI ZAWARTOŚCI NIEOKREŚLONEGO TYPU -->
<h1>Mój ulubiony owoc</h1>

<p>
  Moim ulubionym owocem jest czereśnia.
</p>

<p>
  Ponieważ uwielbiam ten czereśniowy smak.
</p>
<!-- KONIEC DRUGIEJ SEKCJI ZAWARTOŚCI NIEOKREŚLONEGO TYPU -->

Do pierwszej sekcji zawartości nieokreślonego typu należy: pierwszy element h1, pierwszy element p oraz drugi element p.

Do drugiej sekcji zawartości nieokreślonego typu należy: drugi element h1, trzeci element p oraz czwarty element p.

Początek granicy sekcji zawartości nieokreślonego typu wyznacza element HTML tworzący daną sekcję zawartości nieokreślonego typu (którą jak już wiemy może tworzyć któryś z elementów HTML należących do kategorii nagłówek zawartości).

Koniec granicy sekcji zawartości nieokreślonego typu wyznacza pierwszy napotkany (po elemencie HTML tworzącym daną sekcję zawartości nieokreślonego typu) element HTML należący do kategorii sekcja zawartości lub element HTML posiadający taką samą lub wyższą rangę (elementy HTML mogące posiadać swoją rangę oraz występujące w zawartości jakiegokolwiek innego elementu HTML należącego do kategorii korzeń sekcji lub należącego do kategorii sekcja zawartości nie są brane pod uwagę).

Jeżeli żaden z powyższych warunków nie jest spełniony, wtedy koniec granicy sekcji zawartości nieokreślonego typu wyznacza tag zamykający zawartość pierwszego napotkanego elementu przodka elementu HTML tworzącego daną sekcję zawartości nieokreślonego typu, który to element przodek należy do kategorii korzeń sekcji lub który to element przodek należy do kategorii sekcja zawartości.

Przykład:

<body>
  <!-- POCZĄTEK PIERWSZEJ SEKCJI ZAWARTOŚCI NIEOKREŚLONEGO TYPU -->
  <h1>Mój ulubiony kolor</h1>

  <p>
    Moim ulubionym kolorem jest kolor błękitny.
  </p>

  <!-- POCZĄTEK DRUGIEJ SEKCJI ZAWARTOŚCI NIEOKREŚLONEGO TYPU -->
  <h2>Dlaczego błękitny?</h2><!-- to nie jest koniec pierwszej sekcji zawartości nieokreślonego typu, ponieważ element "h2" posiada niższą rangę od rangi posiadanej przez element "h1" -->

  <p>
    Ponieważ błękitny to kolor nieba.
  </p>

  <!-- KONIEC DRUGIEJ SEKCJI ZAWARTOŚCI NIEOKREŚLONEGO TYPU -->
  <!-- KONIEC PIERWSZEJ SEKCJI ZAWARTOŚCI NIEOKREŚLONEGO TYPU -->
  <article>
    <h1>Mój ulubiony kwiat</h1>

    <p>
      Moim ulubionym kwiatem jest róża.
    </p>

    <p>
      Ponieważ róża to symbol miłości.
    </p>
  </article>

  <!-- POCZĄTEK TRZECIEJ SEKCJI ZAWARTOŚCI NIEOKREŚLONEGO TYPU -->
  <h1>Mój ulubiony owoc</h1>

  <p>
    Moim ulubionym owocem jest czereśnia.
  </p>

  <p>
    Ponieważ uwielbiam ten czereśniowy smak.
  </p>

  <blockquote>
    <h1>Czereśnia</h1><!-- to nie jest koniec trzeciej sekcji zawartości nieokreślonego typu, ponieważ ten element "h1" znajduje się w zawartości elementu HTML tworzącego nowy korzeń sekcji (w tym wypadku typu blockquote) -->
    <!-- miejsce na pozostały kod HTML elementu "blockquote" -->
  </blockquote><!-- to nie jest koniec trzeciej sekcji zawartości nieokreślonego typu, ponieważ ten element "blockquote" tworzący korzeń sekcji typu blockquote nie jest elementem przodkiem elementu HTML tworzącego trzecią sekcję zawartości nieokreślonego typu" -->
  <!-- KONIEC TRZECIEJ SEKCJI ZAWARTOŚCI NIEOKREŚLONEGO TYPU -->
</body><!-- tag zamykający zawartość korzenia sekcji typu body -->

Aby łatwiej dostrzec, które elementy HTML należą do danej sekcji zawartości nieokreślonego typu, element HTML tworzący daną sekcję zawartości nieokreślonego typu, jak również elementy HTML należące do danej sekcji zawartości nieokreślonego typu możemy umieścić w dodatkowym elemencie HTML, na przykład w dodatkowym elemencie div, ponieważ domyślnie element div nie zmienia znaczenia struktury HTML w żaden szczególny sposób.

Przykład:

<body>
  <div>
    <!-- POCZĄTEK PIERWSZEJ SEKCJI ZAWARTOŚCI NIEOKREŚLONEGO TYPU -->
    <h1>Mój ulubiony kolor</h1>

    <p>
      Moim ulubionym kolorem jest kolor błękitny.
    </p>

    <div>
      <!-- POCZĄTEK DRUGIEJ SEKCJI ZAWARTOŚCI NIEOKREŚLONEGO TYPU -->
      <h2>Dlaczego błękitny?</h2><!-- to nie jest koniec pierwszej sekcji zawartości nieokreślonego typu, ponieważ element "h2" posiada niższą rangę od rangi posiadanej przez element "h1" -->

      <p>
        Ponieważ błękitny to kolor nieba.
      </p>
    </div>
  </div>

  <!-- KONIEC DRUGIEJ SEKCJI ZAWARTOŚCI NIEOKREŚLONEGO TYPU -->
  <!-- KONIEC PIERWSZEJ SEKCJI ZAWARTOŚCI NIEOKREŚLONEGO TYPU -->
  <article>
    <h1>Mój ulubiony kwiat</h1>

    <p>
      Moim ulubionym kwiatem jest róża.
    </p>

    <p>
      Ponieważ róża to symbol miłości.
    </p>
  </article>

  <div>
    <!-- POCZĄTEK TRZECIEJ SEKCJI ZAWARTOŚCI NIEOKREŚLONEGO TYPU -->
    <h1>Mój ulubiony owoc</h1>

    <p>
      Moim ulubionym owocem jest czereśnia.
    </p>

    <p>
      Ponieważ uwielbiam ten czereśniowy smak.
    </p>

    <blockquote>
      <h1>Czereśnia</h1><!-- to nie jest koniec trzeciej sekcji zawartości nieokreślonego typu, ponieważ ten element "h1" znajduje się w zawartości elementu HTML tworzącego nowy korzeń sekcji (w tym wypadku typu blockquote) -->
      <!-- miejsce na pozostały kod HTML elementu "blockquote" -->
    </blockquote><!-- to nie jest koniec trzeciej sekcji zawartości nieokreślonego typu, ponieważ ten element "blockquote" tworzący korzeń sekcji typu blockquote nie jest elementem przodkiem elementu HTML tworzącego trzecią sekcję zawartości nieokreślonego typu" -->
  </div>
  <!-- KONIEC TRZECIEJ SEKCJI ZAWARTOŚCI NIEOKREŚLONEGO TYPU -->
</body><!-- tag zamykający zawartość korzenia sekcji typu body -->

Elementy "div" nie wpływają ani na to gdzie jest początek, ani na to gdzie jest koniec sekcji zawartości nieokreślonego typu.

Tylko elementy HTML występujące w kodzie HTML po elemencie HTML tworzącym sekcję zawartości nieokreślonego typu mogą należeć do danej sekcji zawartości nieokreślonego typu.