Samouczek HTML

Strona główna HTML Wprowadzenie do HTML Edytory HTML Podstawy HTML Elementy HTML Atrybuty HTML Nagłówki HTML Akapity HTML Style HTML Formatowanie HTML Cytaty HTML Komentarze HTML Kolory HTML HTML CSS Linki HTML Obrazy HTML Ulubione HTML Tabele HTML Listy HTML Blok HTML i wbudowany Klasy HTML Identyfikator HTML Ramki HTML HTML JavaScript Ścieżki plików HTML Nagłówek HTML Układ HTML HTML Responsywne Kod komputerowy HTML Semantyka HTML Przewodnik po stylach HTML Jednostki HTML Symbole HTML Emotikony HTML Zestaw znaków HTML Kodowanie adresu URL HTML HTML a XHTML

Formularze HTML

Formularze HTML Atrybuty formularza HTML Elementy formularza HTML Typy danych wejściowych HTML Atrybuty wejściowe HTML Atrybuty formularza wejściowego HTML

Grafika HTML

Płótno HTML HTML SVG

Media HTML

Media HTML Wideo HTML Dźwięk HTML Wtyczki HTML HTML YouTube

API HTML

Geolokalizacja HTML Przeciągnij/upuść HTML Magazyn sieciowy HTML HTML Web Workers HTML SSE

Przykłady HTML

Przykłady HTML Quiz HTML Ćwiczenia HTML Certyfikat HTML Podsumowanie HTML Dostępność HTML

Odniesienia HTML

Lista znaczników HTML Atrybuty HTML Globalne atrybuty HTML Obsługa przeglądarki HTML Zdarzenia HTML Kolory HTML Płótno HTML HTML audio/wideo Dokumenty HTML Zestawy znaków HTML Kodowanie adresu URL HTML Kody językowe HTML Wiadomości HTTP Metody HTTP Konwerter PX na EM Skróty klawiszowe

Style HTML


Atrybut HTML stylesłuży do dodawania stylów do elementu, takich jak kolor, czcionka, rozmiar i inne.


Przykład

Jestem Czerwony

Jestem niebieski

Jestem duży


Atrybut stylu HTML

Ustawienie stylu elementu HTML można wykonać za pomocą styleatrybutu.

Atrybut HTML stylema następującą składnię:

<tagname style="property:value;">

Właściwość jest własnością CSS. Wartość jest wartością CSS.

Więcej o CSS dowiesz się w dalszej części tego samouczka.


Kolor tła

Właściwość CSS background-colordefiniuje kolor tła elementu HTML.

Przykład

Ustaw kolor tła strony na powderblue:

<body style="background-color:powderblue;">

<h1>This is a heading</h1>
<p>This is a paragraph.</p>

</body>

Przykład

Ustaw kolor tła dla dwóch różnych elementów:

<body>

<h1 style="background-color:powderblue;">This is a heading</h1>
<p style="background-color:tomato;">This is a paragraph.</p>

</body>


Kolor tekstu

Właściwość CSS colordefiniuje kolor tekstu dla elementu HTML:

Przykład

<h1 style="color:blue;">This is a heading</h1>
<p style="color:red;">This is a paragraph.</p>

Czcionki

Właściwość CSS font-familydefiniuje czcionkę, która ma być użyta w elemencie HTML:

Przykład

<h1 style="font-family:verdana;">This is a heading</h1>
<p style="font-family:courier;">This is a paragraph.</p>

Rozmiar czcionki

Właściwość CSS font-sizedefiniuje rozmiar tekstu dla elementu HTML:

Przykład

<h1 style="font-size:300%;">This is a heading</h1>
<p style="font-size:160%;">This is a paragraph.</p>

Wyrównanie tekstu

Właściwość CSS text-aligndefiniuje poziome wyrównanie tekstu dla elementu HTML:

Przykład

<h1 style="text-align:center;">Centered Heading</h1>
<p style="text-align:center;">Centered paragraph.</p>

Podsumowanie rozdziału

  • Użyj styleatrybutu do stylizacji elementów HTML
  • Użyj background-colordo koloru tła
  • Użyj colordla kolorów tekstu
  • Użyj font-familydla czcionek tekstowych
  • Użyj font-sizedla rozmiarów tekstu
  • Użyj text-aligndo wyrównania tekstu

Ćwiczenia HTML

Sprawdź się za pomocą ćwiczeń

Ćwiczenie:

Użyj prawidłowego atrybutu HTML i CSS, aby ustawić kolor akapitu na „niebieski”.

<p =";">To jest akapit.</p>