Dokumentacja HTML z przykładami: Komentarze

Q: Jak napisać komentarz w HTML?

Zacznij go od : . Przeglądarka ignoruje wszystko między tymi znacznikami, łącznie ze znacznikami HTML, więc ta sama składnia służy do zakomentowywania kodu.

Q: Czy komentarze HTML można zagnieżdżać?

Nie. Pierwsze --> kończy komentarz, więc w c --> tekst c --> wyświetla się na stronie. Aby zakomentować blok, który zawiera komentarz, najpierw usuń lub zmień komentarz wewnętrzny.

Q: Czy komentarze HTML działają w CSS lub JavaScripcie?

Nie. W elemencie używaj / ... /, a w używaj // lub / ... /. Komentarz HTML w bloku stylów nie ukrywa reguł CSS w środku.

Komentarze w HTML: składnia, wiele linii i skróty

Komentarz HTML to tekst między , którego przeglądarka nie wyświetla. Poznaj składnię, komentarze wieloliniowe, zakomentowywanie kodu, skrót w edytorze, powód, dla którego komentarzy nie da się zagnieżdżać, i dlaczego nigdy nie są prywatne.

Na tej stronie są działające edytory: edytuj, uruchamiaj i od razu zobacz wynik.

Autor: Kevin Spektor, Współzałożyciel i CTO

Opublikowano Sep 24, 2026

Jak napisać komentarz w HTML

Komentarz HTML zaczyna się od . Przeglądarka ignoruje wszystko między tymi znacznikami, więc tekst nigdy nie pojawia się na stronie:

<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="utf-8">
  <title>Comments</title>
</head>
<body>
  <!-- This comment is not displayed -->
  <h1>Visible heading</h1>

  <!--
    A comment can span several lines.
    Use it for notes to yourself or your team.
  -->
  <p>Visible paragraph.</p>
</body>
</html>

Wyświetlają się tylko nagłówek i akapit. HTML ma jedną składnię komentarzy i działa ona zarówno dla jednej linii, jak i wielu.

Skrót w VS Code i większości edytorów: zaznacz kilka linii i naciśnij Ctrl + / (Cmd + / na Macu). Edytor doda znaczniki za ciebie, a te same klawisze je usuwają.

Zakomentowywanie kodu

Przeglądarka ignoruje znaczniki wewnątrz komentarza, więc otoczenie kodu przez  ukrywa go bez usuwania. To najszybszy sposób, żeby przetestować stronę bez jakiegoś elementu:

<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="utf-8">
  <title>Comment out</title>
  <style>
    .banner { background: #fef3c7; padding: 8px 12px; border-radius: 6px; }
  </style>
</head>
<body>
  <!-- <div class="banner">Sale ends Friday</div> -->
  <h1>Shop</h1>
  <!--
  <ul>
    <li>Old menu item</li>
    <li>Another old item</li>
  </ul>
  -->
  <p>Remove the comment markers around the banner to bring it back.</p>
</body>
</html>

Usuń  w linii z banerem, a pojawi się z powrotem. Zakomentowany kod nadal jest pobierany razem ze stroną, więc gdy masz pewność, że go nie potrzebujesz, usuń go.

Komentarzy nie da się zagnieżdżać

Pierwsze --> zawsze zamyka komentarz. Jeśli zakomentowywany kod zawiera już komentarz, zewnętrzny komentarz kończy się za wcześnie, a reszta wylewa się na stronę. Ten przykład przekazuje zagnieżdżone komentarze parserowi przeglądarki i pokazuje, co zostaje widoczne:

<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="utf-8">
  <title>Nested comments</title>
  <style>
    pre { background: #e5e7eb; padding: 8px; white-space: pre-wrap; }
  </style>
</head>
<body>
  <pre id="out"></pre>
  <script>
    const html = '<!-- outer <!-- inner --> still meant to be hidden -->';
    const box = document.createElement('div');
    box.innerHTML = html;
    document.getElementById('out').textContent =
      'Source:  ' + html + '\nVisible: ' + box.textContent;
  </script>
</body>
</html>

still meant to be hidden --> wyświetla się jako tekst. Zanim zakomentujesz duży blok, usuń komentarze w jego wnętrzu (albo zmień ich -->, żeby przestało pasować).

Jeszcze kilka zasad: komentarz nie może zaczynać się od , więc nie umieszczaj żadnego z nich w treści komentarza.

Komentarze są publiczne

Komentarze są częścią HTML wysyłanego przez serwer, więc każdy odwiedzający może je przeczytać przez Wyświetl źródło lub narzędzia deweloperskie. Skrypt też może je wypisać:

<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="utf-8">
  <title>Comments are public</title>
  <style>
    li { font-family: monospace; }
  </style>
</head>
<body>
  <!-- TODO: fix the checkout button -->
  <p>This page has comments. Here they are:</p>
  <!-- admin password is hunter2 (never do this) -->
  <ul id="list"></ul>
  <script>
    const walker = document.createTreeWalker(document, NodeFilter.SHOW_COMMENT);
    while (walker.nextNode()) {
      const li = document.createElement('li');
      li.textContent = walker.currentNode.data.trim();
      document.getElementById('list').appendChild(li);
    }
  </script>
</body>
</html>

Ograniczaj komentarze do notatek o kodzie. Nic prywatnego (hasła, klucze API, wewnętrzne adresy URL, dane klientów) nie może znaleźć się w HTML, zakomentowane czy nie. Narzędzia do budowania i minifikatory zwykle usuwają komentarze z produkcyjnego HTML, co przy okazji oszczędza kilka bajtów.

Komentarze w CSS i JavaScripcie

Komentarze HTML działają tylko w HTML. W <style> i <script> używasz składni komentarzy danego języka:

<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="utf-8">
  <title>CSS and JS comments</title>
  <style>
    /* A CSS comment: this rule is disabled */
    /* p { color: #dc2626; } */

    <!-- h1 { color: #2563eb; } -->
  </style>
</head>
<body>
  <h1>This heading is blue</h1>
  <p id="msg">Paragraph</p>
  <script>
    // A JavaScript comment
    /* Block comments work in JavaScript too */
    document.getElementById('msg').textContent = 'Set by the script';
  </script>
</body>
</html>

Nagłówek robi się niebieski: CSS ignoruje same znaczniki  i nadal stosuje regułę między nimi. Tylko /* ... */ wyłącza CSS. Tę składnię opisuje strona komentarze w CSS.

Komentarze warunkowe

W starym kodzie czasem pojawia się . Były to instrukcje dla Internet Explorera 9 i starszych. Każda obecna przeglądarka traktuje je jak zwykłe komentarze, więc treść w środku jest ignorowana i cały blok można usunąć.

Częste błędy

Zagnieżdżanie komentarzy. Wewnętrzne --> kończy zewnętrzny komentarz. Usuń wewnętrzne komentarze, zanim zakomentujesz blok.
Sekrety w komentarzach. Komentarze trafiają do każdego odwiedzającego.
Brak -->. Wszystko od <!-- do końca pliku znika, co wygląda, jakby zniknęła połowa strony.
Używanie  w CSS. Nie wyłącza reguł. Użyj /* */.
Używanie // w HTML. // note wyświetla się jako tekst. HTML rozumie tylko .

Najczęściej zadawane pytania

Jak napisać komentarz w HTML?

Zacznij go od : . Przeglądarka ignoruje wszystko między tymi znacznikami, łącznie ze znacznikami HTML, więc ta sama składnia służy do zakomentowywania kodu.

Jak zrobić komentarz wieloliniowy w HTML?

HTML ma tylko jedną składnię komentarzy i może ona obejmować dowolnie wiele linii. Umieść  po ostatniej.

Jaki jest skrót do komentowania w HTML?

W VS Code i większości edytorów kodu zaznacz linie i naciśnij Ctrl + / (Windows i Linux) lub Cmd + / (Mac). Edytor otacza zaznaczenie przez , a te same klawisze je usuwają.

Czy komentarze HTML można zagnieżdżać?

Nie. Pierwsze --> kończy komentarz, więc w  c --> tekst c --> wyświetla się na stronie. Aby zakomentować blok, który zawiera komentarz, najpierw usuń lub zmień komentarz wewnętrzny.

Czy użytkownicy widzą komentarze HTML?

Nie są wyświetlane, ale trafiają do przeglądarki razem ze stroną. Każdy może je przeczytać przez Wyświetl źródło lub narzędzia deweloperskie, więc nigdy nie umieszczaj w nich haseł, kluczy ani prywatnych notatek.

Czy komentarze HTML działają w CSS lub JavaScripcie?

Nie. W elemencie <style> używaj /* ... */, a w <script> używaj // lub /* ... */. Komentarz HTML w bloku stylów nie ukrywa reguł CSS w środku.

Powiązane zagadnienia