<main>
Główna, unikalna treść strony. Na stronie jest tylko jeden widoczny.
- Wyświetlanie
- block
- Znacznik zamykający
- Wymagany
- Dozwolona zawartość
- Treść przepływu (flow content)
Przykład
#<a href="#tresc">Przejdź do treści</a>
<header>Logo i menu</header>
<main id="tresc">
<h1>Kurs HTML od podstaw</h1>
<p>Zbuduj swoją pierwszą stronę w siedem dni.</p>
</main>
<footer>© 2026 CodeWorlds</footer>Definicja i zastosowanie
#Element <main> obejmuje najważniejszą treść dokumentu, czyli to, po co użytkownik przyszedł na stronę. Nie powinny się w nim znaleźć elementy powtarzane na wielu podstronach: logo, główna nawigacja, stopka czy baner z ciasteczkami.
Na stronie może być tylko jeden widoczny element <main>. Kilka jest dozwolonych jedynie wtedy, gdy pozostałe mają atrybut hidden, na przykład w aplikacji przełączającej widoki bez przeładowania.
Dzięki <main> czytniki ekranu i linki „Przejdź do treści” trafiają prosto do właściwej części strony, z pominięciem nagłówka i menu.
Składnia
#<main>
…
</main>Atrybuty
#Ten element nie ma własnych atrybutów. Obsługuje atrybuty globalne, takie jak class, id czy hidden.
Domyślny CSS
#Większość przeglądarek wyświetla ten element z takimi stylami domyślnymi:
main {
display: block;
}Obsługa przeglądarek
#Szeroko dostępne
Działa we wszystkich nowoczesnych przeglądarkach, także na telefonach. Możesz używać bez obaw.
- Chrome
- Edge
- Firefox
- Safari
Dobre praktyki
#<main>nie może być potomkiem<article>,<aside>,<footer>,<header>ani<nav>.- Dodaj na początku strony link „Przejdź do treści” wskazujący
idelementu<main>.
Powiązane hasła
#- <header>Wstęp do strony lub sekcji: logo, tytuł, nawigacja, dane autora.
- <footer>Stopka strony lub sekcji: autor, prawa autorskie, linki, dane kontaktowe.
- <article>Samodzielna, zamknięta treść, którą można przeczytać i udostępnić osobno.
- <section>Tematyczna część dokumentu, zwykle z własnym nagłówkiem.
- <body>Widoczna część dokumentu: wszystko, co użytkownik zobaczy na stronie i z czym może wejść w interakcję.
Widzisz błąd albo brakuje przykładu? Napisz do nas.