Element <style> w HTML

Słownik kwalifikacji INF.03 - Tworzenie i administrowanie stronami i aplikacjami internetowymi oraz bazami danych

Element `<style>` w HTML

Element <style> służy do umieszczania kodu CSS bezpośrednio w dokumencie HTML. Jest to tzw. styl wewnętrzny, czyli zapisany w tym samym pliku co struktura strony.

Najczęściej znacznik <style> umieszcza się w sekcji <head>, ponieważ style dotyczą wyglądu całego dokumentu i powinny zostać wczytane przed wyświetleniem treści strony.

Przykład użycia

<!DOCTYPE html>
<html lang='pl'>
<head>
  <meta charset='UTF-8'>
  <title>Przykład CSS</title>
  <style>
    body {
      background-color: lightgray;
      font-family: Arial, sans-serif;
    }

    h1 {
      color: navy;
      text-align: center;
    }
  </style>
</head>
<body>
  <h1>Witaj na stronie</h1>
</body>
</html>

Do czego służy `<style>`?

Za pomocą tego znacznika można definiować reguły CSS, np.:

kolor tekstu,
tło strony,
wielkość czcionki,
marginesy i odstępy,
obramowania,
układ elementów.

Ważne rozróżnienie egzaminacyjne

Kod CSS można dołączyć do HTML na kilka sposobów:

przez znacznik <style> — style wewnętrzne,
przez znacznik <link> — zewnętrzny plik CSS,
przez atrybut style — style wpisane bezpośrednio w elemencie HTML.

W pytaniu: „Kod CSS można włączyć do dokumentu HTML, używając znacznika...” poprawną odpowiedzią jest <style>, ponieważ właśnie ten element zawiera kod CSS wewnątrz dokumentu HTML.

Znaczniki <head>, <meta> i <body> nie służą bezpośrednio do zapisywania reguł CSS.