Przejdź do treści

Przeglądarki

Każdy webmaster z pewnością zastanawiał się, czy wybrany element HTML lub CSS będzie poprawnie wyświetlany we wszystkich popularnych przeglądarkach. Teraz można to szybko sprawdzić w jednym miejscu - w poniższym zestawieniu. Szczegółowe informacje znajdziesz w odpowiednich sekcjach opisujących działanie tych elementów w przeglądarkach.

Ranking przeglądarek

PozycjaPrzeglądarkaPoziom wsparciaNie obsługuje
🏅 1.Chrome Chrome98.11% (311/317)• HTML / HTML5 / Filmy i dźwięk <video, audio, source>
• HTML / HTML5 / Piaskownica zabezpieczająca <iframe sandbox>
• CSS / Czcionki CSS / Wariant pozycji czcionki {font-variant-position}
• CSS / Wykazy CSS / Niestandardowy typ stylu wykazu @counter-style
• CSS / Tabele CSS / Podpis tabeli {caption-side}
• CSS / Komendy CSS 2 / speak
🏅 1.Edge Edge98.11% (311/317)• HTML / HTML5 / Filmy i dźwięk <video, audio, source>
• HTML / HTML5 / Piaskownica zabezpieczająca <iframe sandbox>
• CSS / Czcionki CSS / Wariant pozycji czcionki {font-variant-position}
• CSS / Wykazy CSS / Niestandardowy typ stylu wykazu @counter-style
• CSS / Tabele CSS / Podpis tabeli {caption-side}
• CSS / Komendy CSS 2 / speak
🏅 1.Opera Opera98.11% (311/317)• HTML / HTML5 / Filmy i dźwięk <video, audio, source>
• HTML / HTML5 / Piaskownica zabezpieczająca <iframe sandbox>
• CSS / Czcionki CSS / Wariant pozycji czcionki {font-variant-position}
• CSS / Wykazy CSS / Niestandardowy typ stylu wykazu @counter-style
• CSS / Tabele CSS / Podpis tabeli {caption-side}
• CSS / Komendy CSS 2 / speak
🥈 2.Safari Safari96.85% (307/317)• HTML / HTML5 / Filmy i dźwięk <video, audio, source>
• HTML / HTML5 / Pola formularza <input "color, date, datetime-local, email, month, number, range, search, tel, time, url, week" min max step multiple>
• HTML / HTML5 / Element ukryty <... hidden>
• HTML / HTML5 / Piaskownica zabezpieczająca <iframe sandbox>
• HTML / HTML5 / Zawijanie tekstu w formularzu <textarea wrap>
• CSS / Obramowanie CSS / Dekoracja przełamania obramowania {box-decoration-break}
• CSS / Wykazy CSS / Niestandardowy typ stylu wykazu @counter-style
• CSS / Tabele CSS / Podpis tabeli {caption-side}
• CSS / Drukowanie CSS / Przełamanie strony {page-break-before, page-break-after}
• CSS / Komendy CSS 2 / speak
🥉 3.Firefox Firefox95.9% (304/317)• HTML / HTML5 / Filmy i dźwięk <video, audio, source>
• HTML / HTML5 / Autouzupełnianie <datalist>
• HTML / HTML5 / Pola formularza <input "color, date, datetime-local, email, month, number, range, search, tel, time, url, week" min max step multiple>
• HTML / HTML5 / Blokowanie wyświetlania <link "stylesheet" blocking, script blocking, style blocking>
• HTML / HTML5 / Zawijanie tekstu w formularzu <textarea wrap>
• CSS / Wykazy CSS / Niestandardowy typ stylu wykazu @counter-style
• CSS / Tabele CSS / Podpis tabeli {caption-side}
• CSS / Drukowanie CSS / Przełamanie strony {page-break-before, page-break-after}
• CSS / Drukowanie CSS / Linijki na stronie {widows, orphans}
• CSS / Drukowanie CSS / Druk dwustronny @page :left :right
• CSS / Układ wielokolumnowy CSS / Przełamanie kolumny {break-before, break-inside, break-after}
• CSS / Media CSS / Zapytania mediów
• CSS / Komendy CSS 2 / speak

HTML

HTML dla zielonych

Ramy dokumentu HTML <!doctype, html, head, meta charset "description", title, body>

Jak wygląda typowy dokument HTML? Co to są podstrony?


Chrome
Firefox
Edge
Opera
Safari
<html>1
2008-12-11		1
2004-11-09		12
2015-07-29		≤12.1
2012-11-20		1
2003-06-23

Nagłówek i treść HTML

Struktura dokumentu HTML

Co to jest nagłówek, a co ciało dokumentu? Jak dodać do dokumentu dodatkowe informacje, mówiące o jego charakterze?


Chrome
Firefox
Edge
Opera
Safari
<body>1
2008-12-11		1
2004-11-09		12
2015-07-29		15
2013-07-02		1
2003-06-23
<head>1
2008-12-11		1
2004-11-09		12
2015-07-29		15
2013-07-02		1
2003-06-23
<meta>1
2008-12-11		1
2004-11-09		12
2015-07-29		≤12.1
2012-11-20		1
2003-06-23

Tytuł strony <title>

Jak zmienić tytuł strony, który wyświetla się na górze okna przeglądarki oraz w wyszukiwarkach sieciowych?


Chrome
Firefox
Edge
Opera
Safari
<title>1
2008-12-11		1
2004-11-09		12
2015-07-29		15
2013-07-02		1
2003-06-23

Deklaracja strony kodowej <meta charset>

O czym nie należy zapominać pisząc stronę WWW po polsku?


Chrome
Firefox
Edge
Opera
Safari
<meta charset>1
2008-12-11		1
2004-11-09		12
2015-07-29		15
2013-07-02		3
2007-10-26

Automatyczne odświeżanie strony <meta "refresh">

Co zrobić, aby strona WWW była automatycznie odświeżana co określony czas?


Chrome
Firefox
Edge
Opera
Safari
<meta http-equiv="refresh">1
2008-12-11		1
2004-11-09		12
2015-07-29		≤12.1
2012-11-20		1
2003-06-23

Automatyczne wczytanie strony <meta "url">

Jak wstawić przekierowanie na stronie WWW, czyli automatycznie wczytać inną stronę?


Chrome
Firefox
Edge
Opera
Safari
<meta http-equiv="refresh">1
2008-12-11		1
2004-11-09		12
2015-07-29		≤12.1
2012-11-20		1
2003-06-23

Ikona strony <link "shortcut icon">

W jaki sposób wstawić ikonę obok adresu strony WWW?


Chrome
Firefox
Edge
Opera
Safari
<link rel="icon">4
2010-01-25		2
2006-10-24		12
2015-07-29		9
2006-06-20		3.1
2008-03-18

Tekst HTML

Akapit <p>

W jaki sposób układać tekst na ekranie? Jak dodać nowy akapit? Czym różni się akapit od paragrafu?


Chrome
Firefox
Edge
Opera
Safari
<p>1
2008-12-11		1
2004-11-09		12
2015-07-29		15
2013-07-02		1
2003-06-23

Tytuł nagłówka <h1, h2, h3, h4, h5, h6>

Jak wstawić tytuł (nagłówek) na stronie WWW? W jaki sposób wyświetlić "dymek narzędziowy" po wskazaniu tekstu myszką?


Chrome
Firefox
Edge
Opera
Safari
<h1>1
2008-12-11		1
2004-11-09		12
2015-07-29		15
2013-07-02		1
2003-06-23
<h2>1
2008-12-11		1
2004-11-09		12
2015-07-29		15
2013-07-02		1
2003-06-23
<h3>1
2008-12-11		1
2004-11-09		12
2015-07-29		15
2013-07-02		1
2003-06-23
<h4>1
2008-12-11		1
2004-11-09		12
2015-07-29		15
2013-07-02		1
2003-06-23
<h5>1
2008-12-11		1
2004-11-09		12
2015-07-29		15
2013-07-02		1
2003-06-23
<h6>1
2008-12-11		1
2004-11-09		12
2015-07-29		15
2013-07-02		1
2003-06-23

Blok <div>

Jak zgrupować elementy w blok?


Chrome
Firefox
Edge
Opera
Safari
<div>1
2008-12-11		1
2004-11-09		12
2015-07-29		15
2013-07-02		1
2003-06-23

Koniec linii <br>

W jaki sposób przenieść tekst do następnej linijki w dokumencie HTML?


Chrome
Firefox
Edge
Opera
Safari
<br>1
2008-12-11		1
2004-11-09		12
2015-07-29		15
2013-07-02		1
2003-06-23

Pogrubienie <b>

W jaki sposób pogrubić (wytłuścić) tekst na stronie WWW?


Chrome
Firefox
Edge
Opera
Safari
<b>1
2008-12-11		1
2004-11-09		12
2015-07-29		15
2013-07-02		1
2003-06-23

Pochylenie <i>

W jaki sposób pochylić tekst na stronie WWW (kursywa)?


Chrome
Firefox
Edge
Opera
Safari
<i>1
2008-12-11		1
2004-11-09		12
2015-07-29		15
2013-07-02		1
2003-06-23

Podkreślenie <u>

W jaki sposób podkreślić tekst na stronie WWW?


Chrome
Firefox
Edge
Opera
Safari
<u>1
2008-12-11		1
2004-11-09		12
2015-07-29		15
2013-07-02		1
2003-06-23

Przekreślenie <s>

W jaki sposób przekreślić tekst na stronie WWW?


Chrome
Firefox
Edge
Opera
Safari
<s>1
2008-12-11		1
2004-11-09		12
2015-07-29		15
2013-07-02		≤4
2009-06-08

Wyróżnienie <em, strong>

Jak wyróżnić tekst na ekranie (emfaza)?


Chrome
Firefox
Edge
Opera
Safari
<em>1
2008-12-11		1
2004-11-09		12
2015-07-29		15
2013-07-02		≤4
2009-06-08
<strong>1
2008-12-11		1
2004-11-09		12
2015-07-29		15
2013-07-02		≤4
2009-06-08

Indeks górny i dolny <sup, sub>

Jak wstawić indeks górny i dolny przy tekście?


Chrome
Firefox
Edge
Opera
Safari
<sub>1
2008-12-11		1
2004-11-09		12
2015-07-29		15
2013-07-02		≤4
2009-06-08
<sup>1
2008-12-11		1
2004-11-09		12
2015-07-29		15
2013-07-02		≤4
2009-06-08

Czcionka pomniejszona <small>

W jaki sposób pomniejszyć tekst?


Chrome
Firefox
Edge
Opera
Safari
<small>1
2008-12-11		1
2004-11-09		12
2015-07-29		15
2013-07-02		≤4
2009-06-08

Tekst preformatowany <pre>

Jak wprowadzić tekst preformatowany, czyli taki, który wygląda identycznie jak w edytorze tekstowym?


Chrome
Firefox
Edge
Opera
Safari
<pre>1
2008-12-11		1
2004-11-09		12
2015-07-29		15
2013-07-02		≤4
2009-06-08

Kod komputerowy <code>

Jak oznaczyć kod komputerowy?


Chrome
Firefox
Edge
Opera
Safari
<code>1
2008-12-11		1
2004-11-09		12
2015-07-29		15
2013-07-02		≤4
2009-06-08

Klawiatura <kbd>

Jak oznaczyć tekst, który użytkownik powinien wprowadzić z klawiatury?


Chrome
Firefox
Edge
Opera
Safari
<kbd>1
2008-12-11		1
2004-11-09		12
2015-07-29		15
2013-07-02		≤4
2009-06-08

Przykład <samp>

Jak oznaczyć tekst, będący przykładem działania programu lub skryptu?


Chrome
Firefox
Edge
Opera
Safari
<samp>1
2008-12-11		1
2004-11-09		12
2015-07-29		15
2013-07-02		≤4
2009-06-08

Zmienna <var>

Jak oznaczyć zmienną lub argument programu?


Chrome
Firefox
Edge
Opera
Safari
<var>1
2008-12-11		1
2004-11-09		12
2015-07-29		15
2013-07-02		≤4
2009-06-08

Źródło <cite>

Jak powinno się wprowadzać odniesienia do źródła?


Chrome
Firefox
Edge
Opera
Safari
<cite>1
2008-12-11		1
2004-11-09		12
2015-07-29		15
2013-07-02		≤4
2009-06-08

Cytat <q>

Jak powinno się oznaczać krótkie cytaty na stronach internetowych?


Chrome
Firefox
Edge
Opera
Safari
<q>1
2008-12-11		1
2004-11-09		12
2015-07-29		15
2013-07-02		3
2007-10-26

Blok cytowany <blockquote>

Jak wprowadzić dłuższy cytat?


Chrome
Firefox
Edge
Opera
Safari
<blockquote>1
2008-12-11		1
2004-11-09		12
2015-07-29		15
2013-07-02		≤4
2009-06-08
<blockquote cite>1
2008-12-11		1
2004-11-09		12
2015-07-29		15
2013-07-02		≤4
2009-06-08

Adres <address>

Jak umieścić na stronie WWW informacje kontatkowe z autorem?


Chrome
Firefox
Edge
Opera
Safari
<address>1
2008-12-11		1
2004-11-09		12
2015-07-29		15
2013-07-02		1
2003-06-23

Zmiany <ins, del>

Jak poinformować użytkownika o wprowadzonych zmianach na stronie WWW: elementy wstawione i usunięte?


Chrome
Firefox
Edge
Opera
Safari
<del>1
2008-12-11		1
2004-11-09		12
2015-07-29		15
2013-07-02		≤4
2009-06-08
<ins>1
2008-12-11		1
2004-11-09		12
2015-07-29		15
2013-07-02		≤4
2009-06-08

Skrót <abbr>

Jak powinno się oznaczać skróty i akronimy?


Chrome
Firefox
Edge
Opera
Safari
<abbr>2
2009-05-21		1
2004-11-09		12
2015-07-29		15
2013-07-02		4
2009-06-08

Definicja <dfn>

Jak oznaczyć definicję terminu?


Chrome
Firefox
Edge
Opera
Safari
<dfn>15
2011-10-25		1
2004-11-09		12
2015-07-29		15
2013-07-02		6
2012-07-25

Słownik <dl, dt, dd>

Jak wprowadzić na stronę WWW słownik (listę definicyjną)?


Chrome
Firefox
Edge
Opera
Safari
<dd>1
2008-12-11		1
2004-11-09		12
2015-07-29		15
2013-07-02		≤4
2009-06-08
<dl>1
2008-12-11		1
2004-11-09		12
2015-07-29		15
2013-07-02		≤4
2009-06-08
<dt>1
2008-12-11		1
2004-11-09		12
2015-07-29		15
2013-07-02		≤4
2009-06-08

Wykaz <ul, ol, li>

Jak wprowadzić na stronę wykaz: wypunktowanie (lista nieuporządkowana) lub numerowanie (lista uporządkowana)?


Chrome
Firefox
Edge
Opera
Safari
<li>1
2008-12-11		1
2004-11-09		12
2015-07-29		≤12.1
2012-11-20		3
2007-10-26
<li type>1
2008-12-11		1
2004-11-09		12
2015-07-29		≤12.1
2012-11-20		≤4
2009-06-08
<li value>1
2008-12-11		1
2004-11-09		12
2015-07-29		≤12.1
2012-11-20		≤4
2009-06-08
<ol>1
2008-12-11		1
2004-11-09		12
2015-07-29		15
2013-07-02		≤4
2009-06-08
<ol start>1
2008-12-11		1
2004-11-09		12
2015-07-29		15
2013-07-02		≤4
2009-06-08
<ol type>1
2008-12-11		1
2004-11-09		12
2015-07-29		15
2013-07-02		≤4
2009-06-08
<ul>1
2008-12-11		1
2004-11-09		12
2015-07-29		15
2013-07-02		≤4
2009-06-08
<ul type>1
2008-12-11		1
2004-11-09		12
2015-07-29		15
2013-07-02		≤4
2009-06-08

Pozioma linia <hr>

Jak umieścić poziomą linię, oddzielającą sąsiednie akapity?


Chrome
Firefox
Edge
Opera
Safari
<hr>1
2008-12-11		1
2004-11-09		12
2015-07-29		≤12.1
2012-11-20		3
2007-10-26

Odsyłacze HTML

Odnośniki hipertekstowe

Jak stworzyć przejście do innej strony WWW (linki)?


Chrome
Firefox
Edge
Opera
Safari
<a>1
2008-12-11		1
2004-11-09		12
2015-07-29		15
2013-07-02		1
2003-06-23

Mapa odsyłaczy <img usemap, map, area>

Jak dodać kilka odnośników (linków, hiperłączy, odsyłaczy hipertekstowych) na jednym obrazku?


Chrome
Firefox
Edge
Opera
Safari
<area>1
2008-12-11		1
2004-11-09		12
2015-07-29		15
2013-07-02		1
2003-06-23
<area alt>1
2008-12-11		1
2004-11-09		12
2015-07-29		15
2013-07-02		1
2003-06-23
<area coords>1
2008-12-11		1
2004-11-09		12
2015-07-29		15
2013-07-02		1
2003-06-23
<area href>1
2008-12-11		1
2004-11-09		12
2015-07-29		15
2013-07-02		1
2003-06-23
<area shape>1
2008-12-11		1
2004-11-09		12
2015-07-29		15
2013-07-02		1
2003-06-23
<map>1
2008-12-11		1
2004-11-09		12
2015-07-29		15
2013-07-02		1
2003-06-23
<map name>1
2008-12-11		1
2004-11-09		12
2015-07-29		15
2013-07-02		1
2003-06-23

Serwerowa mapa odsyłaczy <a href, img ismap>

W jaki sposób przesłać na serwer współrzędne kliknięcia myszką na obrazku?


Chrome
Firefox
Edge
Opera
Safari
<img ismap>1
2008-12-11		1
2004-11-09		12
2015-07-29		15
2013-07-02		3
2007-10-26

Tabele HTML

Struktura tabeli HTML <table, tr, td>

Jak wstawić tabelkę na stronę WWW?


Chrome
Firefox
Edge
Opera
Safari
<table>1
2008-12-11		1
2004-11-09		12
2015-07-29		≤12.1
2012-11-20		1
2003-06-23
<table border>1
2008-12-11		1
2004-11-09		12
2015-07-29		≤12.1
2012-11-20		1
2003-06-23
<td>1
2008-12-11		1
2004-11-09		12
2015-07-29		≤12.1
2012-11-20		1
2003-06-23
<tr>1
2008-12-11		1
2004-11-09		12
2015-07-29		≤12.1
2012-11-20		1
2003-06-23

Komórki nagłówkowe tabeli <th>

Jak powinno się tworzyć nagłówek tabeli?


Chrome
Firefox
Edge
Opera
Safari
<th>1
2008-12-11		1
2004-11-09		12
2015-07-29		≤12.1
2012-11-20		1
2003-06-23
<th align>1
2008-12-11		1
2004-11-09		12
2015-07-29		15
2013-07-02		3
2007-10-26

Tytuł tabeli <caption>

Jak wstawić tytuł (podpis) tabeli?


Chrome
Firefox
Edge
Opera
Safari
<caption>1
2008-12-11		1
2004-11-09		12
2015-07-29		15
2013-07-02		≤4
2009-06-08

Łączenie komórek tabeli <td colspan rowspan>

W jaki sposób połączyć kilka komórek tabeli w jedną dużą?


Chrome
Firefox
Edge
Opera
Safari
<td colspan>1
2008-12-11		1
2004-11-09		12
2015-07-29		15
2013-07-02		1
2003-06-23
<td rowspan>1
2008-12-11		1
2004-11-09		12
2015-07-29		15
2013-07-02		1
2003-06-23

Łączenie wierszy tabeli w grupy <thead, tbody, tfoot>

W jaki sposób połączyć kilka wierszy tabeli w grupę funkcjonalną? Jak wydzielić nagłówek i stopkę tabeli?


Chrome
Firefox
Edge
Opera
Safari
<tbody>1
2008-12-11		1
2004-11-09		12
2015-07-29		≤12.1
2012-11-20		1
2003-06-23
<tfoot>1
2008-12-11		1
2004-11-09		12
2015-07-29		≤12.1
2012-11-20		1
2003-06-23
<thead>1
2008-12-11		1
2004-11-09		12
2015-07-29		≤12.1
2012-11-20		1
2003-06-23

Łączenie kolumn tabeli w grupy <colgroup, col>

W jaki sposób połączyć kilka kolumn tabeli w grupę funkcjonalną?


Chrome
Firefox
Edge
Opera
Safari
<col>1
2008-12-11		1
2004-11-09		12
2015-07-29		15
2013-07-02		≤4
2009-06-08
<col span>1
2008-12-11		1
2004-11-09		12
2015-07-29		15
2013-07-02		≤4
2009-06-08
<colgroup>1
2008-12-11		1
2004-11-09		12
2015-07-29		15
2013-07-02		≤4
2009-06-08
<colgroup span>1
2008-12-11		1
2004-11-09		12
2015-07-29		15
2013-07-02		≤4
2009-06-08

Multimedia HTML

Obrazek HTML <img>

Jak wstawić obrazek (grafikę, zdjęcie, fotografię, ilustrację) na stronę WWW?


Chrome
Firefox
Edge
Opera
Safari
<img>1
2008-12-11		1
2004-11-09		12
2015-07-29		15
2013-07-02		1
2003-06-23
<img alt>1
2008-12-11		1
2004-11-09		12
2015-07-29		15
2013-07-02		3
2007-10-26
<img height>1
2008-12-11		1
2004-11-09		12
2015-07-29		15
2013-07-02		3
2007-10-26
<img src>1
2008-12-11		1
2004-11-09		12
2015-07-29		15
2013-07-02		1
2003-06-23
<img width>1
2008-12-11		1
2004-11-09		12
2015-07-29		15
2013-07-02		3
2007-10-26

Osadzenie pliku <embed>

Jak osadzić na stronie WWW plik multimedialny: animację, film, muzykę (wav, mid, avi, ra, mp3, mpg, mov, asf i inne)?


Chrome
Firefox
Edge
Opera
Safari
<embed>1
2008-12-11		1
2004-11-09		12
2015-07-29		≤12.1
2012-11-20		≤4
2009-06-08
<embed height>1
2008-12-11		1
2004-11-09		12
2015-07-29		≤12.1
2012-11-20		≤4
2009-06-08
<embed src>1
2008-12-11		1
2004-11-09		12
2015-07-29		≤12.1
2012-11-20		≤4
2009-06-08
<embed width>1
2008-12-11		1
2004-11-09		12
2015-07-29		≤12.1
2012-11-20		≤4
2009-06-08

Uniwersalny sposób odtwarzania plików <a "jpg, avi, wav, txt, doc, rtf, xls, pdf", object>

Jak wstawić odtwarzacz multimedialny (filmy, muzyka) na stronę WWW? Jak wstawić na stronę pliki do pobrania (dział download)?


Chrome
Firefox
Edge
Opera
Safari
<object>1
2008-12-11		1
2004-11-09		12
2015-07-29		15
2013-07-02		3
2007-10-26
<object data>1
2008-12-11		1
2004-11-09		12
2015-07-29		15
2013-07-02		3
2007-10-26
<object height>1
2008-12-11		1
2004-11-09		12
2015-07-29		15
2013-07-02		3
2007-10-26
<object width>1
2008-12-11		1
2004-11-09		12
2015-07-29		15
2013-07-02		3
2007-10-26

Widżety HTML

Ramki lokalne <iframe>

Jak wstawić ramkę (okienko, widżet) bezpośrednio w treści strony WWW?


Chrome
Firefox
Edge
Opera
Safari
<iframe>1
2008-12-11		1
2004-11-09		12
2015-07-29		≤15
2013-07-02		≤4
2009-06-08
<iframe height>1
2008-12-11		1
2004-11-09		12
2015-07-29		15
2013-07-02		3
2007-10-26
<iframe name>1
2008-12-11		1
2004-11-09		12
2015-07-29		15
2013-07-02		3
2007-10-26
<iframe src>1
2008-12-11		1
2004-11-09		12
2015-07-29		15
2013-07-02		≤4
2009-06-08
<iframe width>1
2008-12-11		1
2004-11-09		12
2015-07-29		15
2013-07-02		3
2007-10-26

Wczytywanie strony do ramki lokalnej <a target>

Co zrobić, aby strony z menu wczytywały się do ramki umieszczonej bezpośrednio w treści?


Chrome
Firefox
Edge
Opera
Safari
<a target>1
2008-12-11		1
2004-11-09		12
2015-07-29		15
2013-07-02		1
2003-06-23

Formularze HTML

Ramy formularza HTML <form>

Jak wstawić formularz na stronę WWW? Co można uzyskać obsługując formularze przez skrypty? W jaki sposób sprawdzić, czy użytkownik wypełnił wszystkie pola formularza?


Chrome
Firefox
Edge
Opera
Safari
<form>1
2008-12-11		1
2004-11-09		12
2015-07-29		15
2013-07-02		3
2007-10-26
<form action>1
2008-12-11		1
2004-11-09		12
2015-07-29		15
2013-07-02		3
2007-10-26
<form enctype>1
2008-12-11		1
2004-11-09		12
2015-07-29		15
2013-07-02		3
2007-10-26
<form method>1
2008-12-11		1
2004-11-09		12
2015-07-29		15
2013-07-02		3
2007-10-26
<form name>1
2008-12-11		1
2004-11-09		12
2015-07-29		15
2013-07-02		3
2007-10-26

Pole tekstowe <input "text">

Jak wprowadzić pole tekstowe, w którym można wpisać np. imię i nazwisko? W jaki sposób zablokować pole przed wpisywaniem? Jak zmienić kolejność aktywowania elementów przy pomocy tabulatora?


Chrome
Firefox
Edge
Opera
Safari
<input type="text">1
2008-12-11		1
2004-11-09		12
2015-07-29		15
2013-07-02		1
2003-06-23

Hasło <input "password">

Jak wprowadzić pole, w którym można wpisać hasło?


Chrome
Firefox
Edge
Opera
Safari
<input type="password">1
2008-12-11		1
2004-11-09		12
2015-07-29		2
1996-07-14		1
2003-06-23

Pole wyboru <input "checkbox">

Jak dać użytkownikowi możliwość wyboru kilku bądź jednej odpowiedzi? W jaki sposób zaznaczyć pole wyboru po kliknięciu tekstu opisu? W jaki sposób zdefiniować klawisz skrótu? Jak odblokować pole formularza dopiero po wybraniu określonej opcji?


Chrome
Firefox
Edge
Opera
Safari
<input type="checkbox">1
2008-12-11		1
2004-11-09		12
2015-07-29		15
2013-07-02		1
2003-06-23

Pole opcji <input "radio">

Jak wprowadzić na stronę WWW "przełącznik" (pole opcji)?


Chrome
Firefox
Edge
Opera
Safari
<input type="radio">1
2008-12-11		1
2004-11-09		12
2015-07-29		15
2013-07-02		1
2003-06-23

Lista rozwijalna <select, option, optgroup>

Jak wprowadzić rozwijane menu?


Chrome
Firefox
Edge
Opera
Safari
<optgroup>1
2008-12-11		1
2004-11-09		12
2015-07-29		15
2013-07-02		≤4
2009-06-08
<optgroup disabled>1
2008-12-11		1
2004-11-09		12
2015-07-29		15
2013-07-02		≤4
2009-06-08
<optgroup label>1
2008-12-11		1
2004-11-09		12
2015-07-29		15
2013-07-02		≤4
2009-06-08
<option>1
2008-12-11		1
2004-11-09		12
2015-07-29		15
2013-07-02		≤4
2009-06-08
<option disabled>1
2008-12-11		1
2004-11-09		12
2015-07-29		15
2013-07-02		≤4
2009-06-08
<option label>1
2008-12-11		1
2004-11-09		12
2015-07-29		15
2013-07-02		≤4
2009-06-08
<option selected>1
2008-12-11		1
2004-11-09		12
2015-07-29		15
2013-07-02		≤4
2009-06-08
<option value>1
2008-12-11		1
2004-11-09		12
2015-07-29		15
2013-07-02		≤4
2009-06-08
<select>1
2008-12-11		1
2004-11-09		12
2015-07-29		2
1996-07-14		1
2003-06-23
<select disabled>1
2008-12-11		1
2004-11-09		12
2015-07-29		15
2013-07-02		3
2007-10-26
<select form>1
2008-12-11		1
2004-11-09		12
2015-07-29		15
2013-07-02		3
2007-10-26
<select multiple>1
2008-12-11		1
2004-11-09		12
2015-07-29		15
2013-07-02		3
2007-10-26
<select name>1
2008-12-11		1
2004-11-09		12
2015-07-29		15
2013-07-02		3
2007-10-26
<select size>1
2008-12-11		1
2004-11-09		12
2015-07-29		15
2013-07-02		3
2007-10-26

Obszar tekstowy <textarea>

Jak wprowadzić wieloliniowe pole tekstowe, w którym można wpisać dłuższy komentarz?


Chrome
Firefox
Edge
Opera
Safari
<textarea>1
2008-12-11		1
2004-11-09		12
2015-07-29		≤12.1
2012-11-20		≤4
2009-06-08
<textarea cols>1
2008-12-11		1
2004-11-09		12
2015-07-29		≤12.1
2012-11-20		≤4
2009-06-08
<textarea disabled>1
2008-12-11		1
2004-11-09		12
2015-07-29		≤12.1
2012-11-20		≤4
2009-06-08
<textarea form>1
2008-12-11		1
2004-11-09		12
2015-07-29		≤12.1
2012-11-20		≤4
2009-06-08
<textarea name>1
2008-12-11		1
2004-11-09		12
2015-07-29		≤12.1
2012-11-20		≤4
2009-06-08
<textarea readonly>1
2008-12-11		1
2004-11-09		12
2015-07-29		≤12.1
2012-11-20		≤4
2009-06-08
<textarea rows>1
2008-12-11		1
2004-11-09		12
2015-07-29		≤12.1
2012-11-20		≤4
2009-06-08

Selektor plików <input "file">

W jaki sposób umożliwić użytkownikowi wybranie pliku ze swojego dysku lokalnego?


Chrome
Firefox
Edge
Opera
Safari
<input type="file">1
2008-12-11		1
2004-11-09		12
2015-07-29		11
2010-12-16		1
2003-06-23

Ukryte dane <input "hidden">

Jak przesłać ukryte dane w formularzu?


Chrome
Firefox
Edge
Opera
Safari
<input type="hidden">1
2008-12-11		1
2004-11-09		12
2015-07-29		2
1996-07-14		1
2003-06-23

Wysłanie formularza <input "submit, image">

Jak wysłać formularz?


Chrome
Firefox
Edge
Opera
Safari
<input type="submit">1
2008-12-11		1
2004-11-09		12
2015-07-29		15
2013-07-02		1
2003-06-23
<input type="image">1
2008-12-11		1
2004-11-09		12
2015-07-29		15
2013-07-02		1
2003-06-23

Wyczyszczenie danych <input "reset">

Jak wyczyścić wszystkie wprowadzone dane w formularzu? W jaki sposób zapobiec omyłkowemu wyczyszczeniu danych formularza?


Chrome
Firefox
Edge
Opera
Safari
<input type="reset">1
2008-12-11		1
2004-11-09		12
2015-07-29		15
2013-07-02		1
2003-06-23

Przycisk <button>

Jak wprowadzić przycisk na stronę WWW?


Chrome
Firefox
Edge
Opera
Safari
<button>1
2008-12-11		1
2004-11-09		12
2015-07-29		≤15
2013-07-02		1
2003-06-23
<button disabled>1
2008-12-11		1
2004-11-09		12
2015-07-29		15
2013-07-02		≤4
2009-06-08
<button form>9
2011-02-03		4
2011-03-22		16
2017-10-17		15
2013-07-02		5.1
2011-07-20
<button name>1
2008-12-11		1
2004-11-09		12
2015-07-29		15
2013-07-02		≤4
2009-06-08
<button type>1
2008-12-11		1
2004-11-09		12
2015-07-29		15
2013-07-02		≤4
2009-06-08
<button value>1
2008-12-11		1
2004-11-09		12
2015-07-29		15
2013-07-02		≤4
2009-06-08

Grupowanie pól <fieldset, legend>

W jaki sposób zgrupować tematycznie klika pól formularza?


Chrome
Firefox
Edge
Opera
Safari
<fieldset>1
2008-12-11		1
2004-11-09		12
2015-07-29		≤15
2013-07-02		≤4
2009-06-08
<legend>1
2008-12-11		1
2004-11-09		12
2015-07-29		≤12.1
2012-11-20		3
2007-10-26

Forma odszyfrowana <form enctype accept-charset>

Co zrobić, aby formularze były przesyłane w formie odszyfrowanej, którą łatwiej później odczytać? Jak usunąć polskie znaki z formularza?


Chrome
Firefox
Edge
Opera
Safari
<form enctype>1
2008-12-11		1
2004-11-09		12
2015-07-29		15
2013-07-02		3
2007-10-26
<form accept-charset>1
2008-12-11		1
2004-11-09		12
2015-07-29		15
2013-07-02		3
2007-10-26

HTML5

Sekcja <section>

Jak podzielić tematycznie obszerniejsze fragmenty dokumentu HTML5?


Chrome
Firefox
Edge
Opera
Safari
<section>5
2010-05-25		4
2011-03-22		12
2015-07-29		11.1
2011-04-12		5
2010-06-07

Artykuł <article>

Jak wstawić artykuł do dokumentu HTML5?


Chrome
Firefox
Edge
Opera
Safari
<article>5
2010-05-25		4
2011-03-22		12
2015-07-29		11.1
2011-04-12		5
2010-06-07

Wstawka <aside>

W jaki sposób w HTML5 powinno się wstawiać elementy, powiązane tematycznie z artykułem na stronie?


Chrome
Firefox
Edge
Opera
Safari
<aside>5
2010-05-25		4
2011-03-22		12
2015-07-29		11.1
2011-04-12		5
2010-06-07

Podtytuł <hgroup>

W jaki sposób poprawnie wstawić do dokumentu podtytuł?


Chrome
Firefox
Edge
Opera
Safari
<hgroup>5
2010-05-25		4
2011-03-22		12
2015-07-29		11.1
2011-04-12		5
2010-06-07

Nagłówek <header>

Jak powinno się wstawiać wprowadzenie w dokumentach HTML5?


Chrome
Firefox
Edge
Opera
Safari
<header>5
2010-05-25		4
2011-03-22		12
2015-07-29		11.1
2011-04-12		5
2010-06-07

Stopka <footer>

W jaki sposób oznaczyć stopkę w dokumentach HTML5?


Chrome
Firefox
Edge
Opera
Safari
<footer>5
2010-05-25		4
2011-03-22		12
2015-07-29		11.1
2011-04-12		5
2010-06-07

Nawigacja <nav>

Jak wstawić na stronie WWW sekcję z linkami nawigacyjnymi?


Chrome
Firefox
Edge
Opera
Safari
<nav>5
2010-05-25		4
2011-03-22		12
2015-07-29		11.1
2011-04-12		5
2010-06-07

Załącznik <figure, figcaption>

W jaki sposób oznaczyć w HTML5: ilustrację, diagram, zdjęcie, kod źródłowy, rysunek, rycinę, wykres, załącznik?


Chrome
Firefox
Edge
Opera
Safari
<figure>8
2010-12-02		4
2011-03-22		12
2015-07-29		11
2010-12-16		5.1
2011-07-20
<figcaption>8
2010-12-02		4
2011-03-22		12
2015-07-29		11
2010-12-16		5.1
2011-07-20

Główna treść <main>

W jaki sposób wskazać główną zawartość strony WWW?


Chrome
Firefox
Edge
Opera
Safari
<main>26
2013-03-26		21
2013-05-14		12
2015-07-29		16
2013-08-27		7
2013-10-22

Wyszukiwarka <search>

Jak oznaczyć na stronie formularz wyszukiwania lub filtrowania treści?


Chrome
Firefox
Edge
Opera
Safari
<search>118
2023-10-10		118
2023-09-26		118
2023-10-13		104
2023-10-23		17
2023-09-18

Uwydatnienie <mark>

Jak zaznaczyć lub uwydatnić część tekstu?


Chrome
Firefox
Edge
Opera
Safari
<mark>7
2010-10-19		4
2011-03-22		12
2015-07-29		11
2010-12-16		5.1
2011-07-20

Data i czas <time>

W jaki sposób poprawnie oznaczać datę i czas w dokumentach HTML5?


Chrome
Firefox
Edge
Opera
Safari
<time>62
2017-10-17		22
2013-06-25		14
2016-08-02		49
2017-11-08		7
2013-10-22
<time datetime>62
2017-10-17		22
2013-06-25		14
2016-08-02		49
2017-11-08		7
2013-10-22

Możliwy koniec linii <wbr>

Jak umożliwić przeglądarce przełamanie długiej linii do następnego wiersza?


Chrome
Firefox
Edge
Opera
Safari
<wbr>1
2008-12-11		1
2004-11-09		12
2015-07-29		11.6
2011-12-06		4
2009-06-08

Responsywny obrazek <picture, source>

W jaki sposób wstawić na stronie internetowej obrazek (grafikę, zdjęcie, fotografię, ilustrację), który automatycznie dopasowuje się do wielkości ekranu?


Chrome
Firefox
Edge
Opera
Safari
<picture>38
2014-10-07		38
2015-05-12		13
2015-11-12		25
2014-10-15		9.1
2016-03-21
<source>3
2009-09-15		3.5
2009-06-30		12
2015-07-29		15
2013-07-02		3.1
2008-03-18
<source height>90
2021-04-13		108
2022-12-13		90
2021-04-15		76
2021-04-28		15
2021-09-20
<source media>3
2009-09-15		15
2012-08-28		12
2015-07-29		15
2013-07-02		3.1
2008-03-18
<source src>3
2009-09-15		3.5
2009-06-30		12
2015-07-29		15
2013-07-02		3.1
2008-03-18
<source srcset>38
2014-10-07		38
2015-05-12		13
2015-11-12		25
2014-10-15		9.1
2016-03-21
<source type>3
2009-09-15		3.5
2009-06-30		12
2015-07-29		15
2013-07-02		3.1
2008-03-18

Filmy i dźwięk <video, audio, source>

W jaki sposób wstawić odtwarzacz filmów wideo lub muzyki audio na stronie internetowej?

❌ Nie działa

Chrome
Firefox
Edge
Opera
Safari
<video>3
2009-09-15		3.5
2009-06-30		12
2015-07-29		10.5
2010-03-02		3.1
2008-03-18
<video autoplay>3
2009-09-15		3.5
2009-06-30		12
2015-07-29		10.5
2010-03-02		3.1
2008-03-18
<video controls>3
2009-09-15		3.5
2009-06-30		12
2015-07-29		10.5
2010-03-02		3.1
2008-03-18
<video height>3
2009-09-15		3.5
2009-06-30		12
2015-07-29		10.5
2010-03-02		3.1
2008-03-18
<video loop>3
2009-09-15		11
2012-03-13		12
2015-07-29		10.5
2010-03-02		3.1
2008-03-18
<video muted>30
2013-10-01		11
2012-03-13		12
2015-07-29		17
2013-10-08		5
2010-06-07
<video playsinline>75
2019-06-04		❌79
2020-01-15		62
2019-06-27		10
2016-09-20
<video poster>3
2009-09-15		3.6
2010-01-21		12
2015-07-29		10.5
2010-03-02		3.1
2008-03-18
<video preload>3
2009-09-15		4
2011-03-22		12
2015-07-29		15
2013-07-02		3.1
2008-03-18
<video src>3
2009-09-15		3.5
2009-06-30		12
2015-07-29		10.5
2010-03-02		3.1
2008-03-18
<video width>3
2009-09-15		3.5
2009-06-30		12
2015-07-29		10.5
2010-03-02		3.1
2008-03-18
<audio>3
2009-09-15		3.5
2009-06-30		12
2015-07-29		10.5
2010-03-02		3.1
2008-03-18
<audio autoplay>❌❌❌❌❌
<audio controls>3
2009-09-15		3.5
2009-06-30		12
2015-07-29		10.5
2010-03-02		3.1
2008-03-18
<audio loop>3
2009-09-15		11
2012-03-13		12
2015-07-29		10.5
2010-03-02		3.1
2008-03-18
<audio muted>15
2011-10-25		11
2012-03-13		≤18
2018-10-02		15
2013-07-02		6
2012-07-25
<audio preload>3
2009-09-15		4
2011-03-22		12
2015-07-29		15
2013-07-02		3.1
2008-03-18
<audio src>3
2009-09-15		3.5
2009-06-30		12
2015-07-29		10.5
2010-03-02		3.1
2008-03-18
<source>3
2009-09-15		3.5
2009-06-30		12
2015-07-29		15
2013-07-02		3.1
2008-03-18
<source height>90
2021-04-13		108
2022-12-13		90
2021-04-15		76
2021-04-28		15
2021-09-20
<source src>3
2009-09-15		3.5
2009-06-30		12
2015-07-29		15
2013-07-02		3.1
2008-03-18
<source type>3
2009-09-15		3.5
2009-06-30		12
2015-07-29		15
2013-07-02		3.1
2008-03-18
<source width>90
2021-04-13		108
2022-12-13		90
2021-04-15		76
2021-04-28		15
2021-09-20

Napisy do filmów <track>

Jak dodać napisy (ścieżkę tekstową) do filmu wideo?


Chrome
Firefox
Edge
Opera
Safari
<track>23
2012-11-06		31
2014-07-22		12
2015-07-29		12.1
2012-11-20		6
2012-07-25
<track default>23
2012-11-06		31
2014-07-22		12
2015-07-29		12.1
2012-11-20		6
2012-07-25
<track kind>23
2012-11-06		31
2014-07-22		12
2015-07-29		12.1
2012-11-20		6
2012-07-25
<track label>23
2012-11-06		31
2014-07-22		12
2015-07-29		12.1
2012-11-20		6
2012-07-25
<track src>23
2012-11-06		50
2016-11-15		12
2015-07-29		12.1
2012-11-20		6
2012-07-25
<track srclang>23
2012-11-06		31
2014-07-22		12
2015-07-29		12.1
2012-11-20		6
2012-07-25
::cue26
2013-03-26		55
2017-08-08		79
2020-01-15		15
2013-07-02		7
2013-10-22

Autouzupełnianie <datalist>

W jaki sposób dodać autouzupełnianie pola formularza?

🔷 Zawiera błędy

Chrome
Firefox
Edge
Opera
Safari
<datalist>20
2012-06-26		🔷 110
2023-02-14		12
2015-07-29		9.5
2008-06-12		12.1
2019-03-25

Pasek postępu <progress>

Jak wstawić na stronie WWW pasek postępu?


Chrome
Firefox
Edge
Opera
Safari
<progress>6
2010-09-02		6
2011-08-16		12
2015-07-29		11
2010-12-16		6
2012-07-25
<progress max>6
2010-09-02		6
2011-08-16		12
2015-07-29		11
2010-12-16		6
2012-07-25
<progress value>6
2010-09-02		6
2011-08-16		12
2015-07-29		11
2010-12-16		6
2012-07-25

Pasek wyniku <meter>

Jak wstawić na stronie WWW pasek głosowania w ankiecie?


Chrome
Firefox
Edge
Opera
Safari
<meter>6
2010-09-02		16
2012-10-09		13
2015-11-12		11
2010-12-16		6
2012-07-25
<meter high>6
2010-09-02		16
2012-10-09		13
2015-11-12		11
2010-12-16		6
2012-07-25
<meter low>6
2010-09-02		16
2012-10-09		13
2015-11-12		11
2010-12-16		6
2012-07-25
<meter max>6
2010-09-02		16
2012-10-09		13
2015-11-12		11
2010-12-16		6
2012-07-25
<meter min>6
2010-09-02		16
2012-10-09		13
2015-11-12		11
2010-12-16		6
2012-07-25
<meter optimum>6
2010-09-02		16
2012-10-09		13
2015-11-12		11
2010-12-16		6
2012-07-25
<meter value>6
2010-09-02		16
2012-10-09		13
2015-11-12		11
2010-12-16		6
2012-07-25

Otwierany panel <details, summary>

Co zrobić, aby wstawić na stronę panel, otwierany po kliknięciu myszką?


Chrome
Firefox
Edge
Opera
Safari
<details>12
2011-06-07		49
2016-09-20		79
2020-01-15		15
2013-07-02		6
2012-07-25
<details open>12
2011-06-07		49
2016-09-20		79
2020-01-15		15
2013-07-02		6
2012-07-25
<summary>12
2011-06-07		49
2016-09-20		79
2020-01-15		15
2013-07-02		6
2012-07-25

Pola formularza <input "color, date, datetime-local, email, month, number, range, search, tel, time, url, week" min max step multiple>

Jak wstawić na stronie WWW pole (kontrolkę) formularza służącą do wyboru: koloru, daty, czasu, tygodnia roku, adresu e-mail, wartości liczbowej, przedziału (zakresu) liczb, numeru telefonu, adresu strony (URL) czy pole wyszukiwania?

❌ Nie działa

Chrome
Firefox
Edge
Opera
Safari
<input type="color">20
2012-06-26		29
2014-04-29		14
2016-08-02		12
2012-06-14		12.1
2019-03-25
<input type="date">20
2012-06-26		57
2017-11-14		12
2015-07-29		11
2010-12-16		14.1
2021-04-26
<input type="datetime-local">20
2012-06-26		93
2021-10-05		12
2015-07-29		11
2010-12-16		14.1
2021-04-26
<input type="email">5
2010-05-25		1
2004-11-09		12
2015-07-29		11
2010-12-16		5
2010-06-07
<input type="month">20
2012-06-26		❌12
2015-07-29		11
2010-12-16		❌
<input type="number">7
2010-10-19		29
2014-04-29		12
2015-07-29		15
2013-07-02		5.1
2011-07-20
<input type="range">4
2010-01-25		23
2013-08-06		12
2015-07-29		11
2010-12-16		3.1
2008-03-18
<input type="search">5
2010-05-25		4
2011-03-22		12
2015-07-29		10.6
2010-07-01		5
2010-06-07
<input type="tel">3
2009-09-15		4
2011-03-22		12
2015-07-29		11
2010-12-16		4
2009-06-08
<input type="time">20
2012-06-26		57
2017-11-14		12
2015-07-29		10
2009-09-01		14.1
2021-04-26
<input type="url">1
2008-12-11		1
2004-11-09		12
2015-07-29		11
2010-12-16		1
2003-06-23
<input type="week">20
2012-06-26		❌12
2015-07-29		11
2010-12-16		❌
<input min>4
2010-01-25		16
2012-10-09		12
2015-07-29		≤12.1
2012-11-20		5
2010-06-07
<input max>4
2010-01-25		16
2012-10-09		12
2015-07-29		≤12.1
2012-11-20		5
2010-06-07
<input step>5
2010-05-25		16
2012-10-09		12
2015-07-29		≤12.1
2012-11-20		5
2010-06-07
<input multiple>2
2009-05-21		3.6
2010-01-21		12
2015-07-29		≤12.1
2012-11-20		4
2009-06-08

Wstępne ładowanie <link "preload" as>

W jaki sposób przyspieszyć ładowanie zewnętrznych zasobów (plików): zdjęć, filmów wideo, dźwięku audio, arkuszy stylów CSS, czcionek, skryptów?


Chrome
Firefox
Edge
Opera
Safari
<link as>50
2016-04-13		56
2017-09-28		17
2018-04-30		37
2016-05-04		10
2016-09-20

Asynchroniczne ładowanie skryptów <script src async>

W jaki sposób załadować skrypt JavaScript (JS) asynchronicznie, aby nie blokował szybkiego wyświetlania strony WWW?


Chrome
Firefox
Edge
Opera
Safari
<script async>1
2008-12-11		3.6
2010-01-21		12
2015-07-29		15
2013-07-02		≤4
2009-06-08

Blokada autouzupełniania <form autocomplete, input autocomplete, select autocomplete, textarea autocomplete>

Jak zabezpieczyć formularz internetowy przed wyciekiem (ujawnieniem) danych osobowych?


Chrome
Firefox
Edge
Opera
Safari
<form autocomplete>14
2011-09-16		4
2011-03-22		12
2015-07-29		15
2013-07-02		6
2012-07-25
<input autocomplete>14
2011-09-16		4
2011-03-22		12
2015-07-29		≤12.1
2012-11-20		6
2012-07-25
<select autocomplete>66
2018-04-17		59
2018-03-13		79
2020-01-15		53
2018-05-10		9.1
2016-03-21
<textarea autocomplete>66
2018-04-17		59
2018-03-13		79
2020-01-15		53
2018-05-10		9.1
2016-03-21

Blokowanie wyświetlania <link "stylesheet" blocking, script blocking, style blocking>

W jaki sposób załadować skrypt JavaScript (JS) asynchronicznie, ale zatrzymać wyświetlanie (renderowanie) strony, dopóki nie skończy on generować dynamicznej zawartości?

❌ Nie działa

Chrome
Firefox
Edge
Opera
Safari
<link blocking>105
2022-09-02		❌105
2022-09-01		91
2022-09-14		18.2
2024-12-11
<script blocking>105
2022-09-02		❌105
2022-09-01		91
2022-09-14		18.2
2024-12-11
<style blocking>105
2022-09-02		❌105
2022-09-01		91
2022-09-14		18.2
2024-12-11

Deklaracja strony kodowej <meta charset>

Jak HTML5 upraszcza sposób deklarowania strony kodowej umożliwiającej poprawne wyświetlanie znaków diakrytycznych na stronie?


Chrome
Firefox
Edge
Opera
Safari
<meta charset>1
2008-12-11		1
2004-11-09		12
2015-07-29		15
2013-07-02		3
2007-10-26

Element edytowalny <... contenteditable>

Jak sprawić, aby zawartość dowolnego elementu HTML na stronie WWW można było edytować?


Chrome
Firefox
Edge
Opera
Safari
contenteditable1
2008-12-11		3
2008-06-17		12
2015-07-29		9
2006-06-20		≤4
2009-06-08
contenteditable="plaintext-only"51
2016-05-25		136
2025-03-04		12
2015-07-29		38
2016-06-08		≤13.1
2020-03-24

Uwierzytelnienie <audio crossorigin, img crossorigin, link crossorigin, script crossorigin, video crossorigin>

W jaki sposób można identyfikować zalogowanego użytkownika pomiędzy różnymi serwisami?


Chrome
Firefox
Edge
Opera
Safari
<audio crossorigin>33
2014-02-20		74
2020-03-10		≤18
2018-10-02		20
2014-03-04		10
2016-09-20
<img crossorigin>13
2011-08-02		8
2011-11-08		12
2015-07-29		15
2013-07-02		6
2012-07-25
<link crossorigin>34
2014-04-08		18
2013-01-08		17
2018-04-30		21
2014-05-06		10
2016-09-20
<script crossorigin>19
2012-05-15		14
2012-07-17		14
2016-08-02		12
2012-06-14		6
2012-07-25
<video crossorigin>33
2014-02-20		74
2020-03-10		≤18
2018-10-02		20
2014-03-04		10
2016-09-20

Atrybuty danych <... data-...>

Jak dodać do dowolnego znacznika HTML własny, niestandardowy atrybut?


Chrome
Firefox
Edge
Opera
Safari
data-nazwa7
2010-10-19		6
2011-08-16		12
2015-07-29		15
2013-07-02		5.1
2011-07-20

Dekodowanie obrazków <img decoding>

W jaki sposób nie opóźniać wyświetlania strony podczas ładowania dużych obrazków?


Chrome
Firefox
Edge
Opera
Safari
<img decoding>65
2018-03-06		63
2018-10-23		≤79
2020-01-15		52
2018-03-22		11.1
2018-04-12

Grupowa blokada pól formularza <fieldset disabled>

W jaki sposób za jednym razem zablokować kilka pól formularza HTML?


Chrome
Firefox
Edge
Opera
Safari
<fieldset disabled>20
2012-06-26		4
2011-03-22		79
2020-01-15		12
2012-06-14		6
2012-07-25

Pobieranie <a download, area download>

Jak wymusić pobranie pliku na dysk po kliknięciu linka (odnośnika hipertekstowego)?


Chrome
Firefox
Edge
Opera
Safari
<a download>14
2011-09-16		20
2013-04-02		18
2018-10-02		15
2013-07-02		10.1
2017-03-27
<area download>54
2016-10-12		20
2013-04-02		12
2015-07-29		41
2016-10-25		10.1
2017-03-27

Priorytet ładowania <img fetchpriority, link fetchpriority, script fetchpriority>

Jak zapewnić szybsze ładowanie krytycznych zasobów (obrazków, arkuszy stylów, skryptów) osadzonych na stronie?


Chrome
Firefox
Edge
Opera
Safari
<link fetchpriority>101
2022-04-26		132
2024-10-29		101
2022-04-28		87
2022-05-17		17.2
2023-12-11
<script fetchpriority>101
2022-04-26		132
2024-10-29		101
2022-04-28		87
2022-05-17		17.2
2023-12-11

Przypisanie pola do formularza <button form, fieldset form, input form, object form, output form, select form, textarea form>

Czy można umieszczać pola (kontrolki) poza znacznikiem formularza?


Chrome
Firefox
Edge
Opera
Safari
<button form>9
2011-02-03		4
2011-03-22		16
2017-10-17		15
2013-07-02		5.1
2011-07-20
<fieldset form>1
2008-12-11		1
2004-11-09		12
2015-07-29		15
2013-07-02		3
2007-10-26
<input form>1
2008-12-11		1
2004-11-09		12
2015-07-29		≤12.1
2012-11-20		1
2003-06-23
<object form>1
2008-12-11		1
2004-11-09		12
2015-07-29		15
2013-07-02		3
2007-10-26
<output form>10
2011-03-08		4
2011-03-22		≤18
2018-10-02		11
2010-12-16		7
2013-10-22
<select form>1
2008-12-11		1
2004-11-09		12
2015-07-29		15
2013-07-02		3
2007-10-26
<textarea form>1
2008-12-11		1
2004-11-09		12
2015-07-29		≤12.1
2012-11-20		≤4
2009-06-08

Nadpisanie atrybutów formularza <button formaction formenctype formmethod formnovalidate formtarget, input "submit, image" formaction formenctype formmethod formnovalidate formtarget>

W jaki sposób zbudować formularz HTML, który zostanie wysłany pod inny adres, w zależności który przycisk użytkownik kliknie?


Chrome
Firefox
Edge
Opera
Safari
<button formaction>9
2011-02-03		4
2011-03-22		12
2015-07-29		15
2013-07-02		5.1
2011-07-20
<button formenctype>9
2011-02-03		4
2011-03-22		12
2015-07-29		10.6
2010-07-01		5.1
2011-07-20
<button formmethod>9
2011-02-03		4
2011-03-22		12
2015-07-29		15
2013-07-02		5.1
2011-07-20
<button formnovalidate>9
2011-02-03		4
2011-03-22		12
2015-07-29		15
2013-07-02		5.1
2011-07-20
<button formtarget>9
2011-02-03		4
2011-03-22		12
2015-07-29		15
2013-07-02		5.1
2011-07-20
<input formaction>9
2011-02-03		4
2011-03-22		12
2015-07-29		≤12.1
2012-11-20		5
2010-06-07
<input formenctype>9
2011-02-03		4
2011-03-22		12
2015-07-29		≤12.1
2012-11-20		5
2010-06-07
<input formmethod>9
2011-02-03		4
2011-03-22		12
2015-07-29		≤12.1
2012-11-20		5
2010-06-07
<input formnovalidate>4
2010-01-25		4
2011-03-22		12
2015-07-29		≤12.1
2012-11-20		5
2010-06-07
<input formtarget>9
2011-02-03		4
2011-03-22		12
2015-07-29		≤12.1
2012-11-20		5
2010-06-07

Element ukryty <... hidden>

W jaki sposób ukryć element na stronie, ale pozwolić wyszukiwać jego treść?

❌ Nie działa

Chrome
Firefox
Edge
Opera
Safari
hidden10
2011-03-08		4
2011-03-22		12
2015-07-29		15
2013-07-02		5.1
2011-07-20
hidden="until-found"102
2022-05-24		139
2025-05-27		102
2022-05-31		88
2022-06-08		❌

Leniwe ładowanie <iframe loading, img loading>

Co zrobić, żeby obrazki na stronie były ładowane dopiero, kiedy użytkownik przewinie stronę w ich pobliże?


Chrome
Firefox
Edge
Opera
Safari
<iframe loading>77
2019-09-10		121
2023-12-19		79
2020-01-15		64
2019-10-07		16.4
2023-03-27
<img loading>77
2019-09-10		75
2020-04-07		79
2020-01-15		64
2019-10-07		15.4
2022-03-14

Minimalna i maksymalna liczba znaków <input minlength maxlength, textarea minlength maxlength>

Jak wymusić wpisanie w formularzu tekstu przynajmniej o podanej długości? Jak zabezpieczyć się przed wprowadzeniem zbyt długiego tekstu?


Chrome
Firefox
Edge
Opera
Safari
<input minlength>40
2015-01-21		51
2017-01-24		17
2018-04-30		27
2015-01-27		10.1
2017-03-27
<input maxlength>1
2008-12-11		1
2004-11-09		12
2015-07-29		≤12.1
2012-11-20		1
2003-06-23
<textarea minlength>40
2015-01-21		51
2017-01-24		17
2018-04-30		27
2015-01-27		10.1
2017-03-27
<textarea maxlength>4
2010-01-25		4
2011-03-22		12
2015-07-29		≤12.1
2012-11-20		5
2010-06-07

Pominięcie walidacji formularza <form novalidate>

W jaki sposób zrezygnować ze sprawdzania poprawności wypełniania pól formularza?


Chrome
Firefox
Edge
Opera
Safari
<form novalidate>10
2011-03-08		4
2011-03-22		12
2015-07-29		15
2013-07-02		10.1
2017-03-27

Walidacja pól formularza <input pattern>

Jak zrobić pole formularza do wpisania tekstu w niestandardowym formacie - np. kodu pocztowego?


Chrome
Firefox
Edge
Opera
Safari
<input pattern>4
2010-01-25		4
2011-03-22		12
2015-07-29		≤12.1
2012-11-20		5
2010-06-07

Podpowiedź pola formularza <input placeholder, textarea placeholder>

Jak umieścić podpowiedź w polu formularza HTML w postaci szarego tekstu, który zniknie po rozpoczęciu wprowadzania danych?


Chrome
Firefox
Edge
Opera
Safari
<input placeholder>3
2009-09-15		4
2011-03-22		12
2015-07-29		≤12.1
2012-11-20		4
2009-06-08
<textarea placeholder>4
2010-01-25		4
2011-03-22		12
2015-07-29		≤12.1
2012-11-20		5
2010-06-07

Okienko popover <... popover, button "button" popovertarget popovertargetaction, input "button" popovertarget popovertargetaction>

Jak w języku HTML otworzyć wyskakujące okienko na warstwie ponad zawartością strony bez użycia JavaScript?


Chrome
Firefox
Edge
Opera
Safari
popover114
2023-05-30		125
2024-04-16		114
2023-06-02		100
2023-06-29		17
2023-09-18
<button popovertarget>114
2023-05-30		125
2024-04-16		114
2023-06-02		100
2023-06-29		17
2023-09-18
<button popovertargetaction>114
2023-05-30		125
2024-04-16		114
2023-06-02		100
2023-06-29		17
2023-09-18
<input popovertarget>114
2023-05-30		125
2024-04-16		114
2023-06-02		100
2023-06-29		17
2023-09-18
<input popovertargetaction>114
2023-05-30		125
2024-04-16		114
2023-06-02		100
2023-06-29		17
2023-09-18

Pole obowiązkowe <input required, select required, textarea required>

W jaki sposób wymusić wypełnienie obowiązkowego (wymaganego) pola w formularzu HTML?


Chrome
Firefox
Edge
Opera
Safari
<input required>4
2010-01-25		4
2011-03-22		12
2015-07-29		≤12.1
2012-11-20		5
2010-06-07
<select required>10
2011-03-08		4
2011-03-22		12
2015-07-29		15
2013-07-02		5.1
2011-07-20
<textarea required>4
2010-01-25		4
2011-03-22		12
2015-07-29		≤12.1
2012-11-20		5
2010-06-07

Wykaz z numeracją odwrotną <ol reversed>

Jak ponumerować punkty w kolejności malejącej?


Chrome
Firefox
Edge
Opera
Safari
<ol reversed>18
2012-03-28		18
2013-01-08		≤79
2020-01-15		15
2013-07-02		6
2012-07-25

Piaskownica zabezpieczająca <iframe sandbox>

Jak zabezpieczyć zewnętrzne widżety (ramki lokalne), aby nie mogły zainstalować wirusa czy konia trojańskiego użytkownikom naszego serwisu ani wyłudzać od nich danych?

❌ Nie działa

Chrome
Firefox
Edge
Opera
Safari
<iframe sandbox>5
2010-05-25		17
2012-11-20		12
2015-07-29		15
2013-07-02		5
2010-06-07
<iframe sandbox="allow-downloads">83
2020-05-19		82
2020-10-20		83
2020-05-21		69
2020-06-24		17
2023-09-18
<iframe sandbox="allow-forms">5
2010-05-25		≤49
2016-09-20		79
2020-01-15		15
2013-07-02		5
2010-06-07
<iframe sandbox="allow-modals">46
2015-10-13		49
2016-09-20		79
2020-01-15		33
2015-10-27		11.1
2018-04-12
<iframe sandbox="allow-orientation-lock">68
2018-07-24		≤49
2016-09-20		79
2020-01-15		55
2018-08-16		❌
<iframe sandbox="allow-pointer-lock">23
2012-11-06		≤49
2016-09-20		79
2020-01-15		15
2013-07-02		10.1
2017-03-27
<iframe sandbox="allow-popups">17
2012-02-08		28
2014-03-18		12
2015-07-29		15
2013-07-02		6
2012-07-25
<iframe sandbox="allow-popups-to-escape-sandbox">46
2015-10-13		49
2016-09-20		79
2020-01-15		33
2015-10-27		11.1
2018-04-12
<iframe sandbox="allow-presentation">53
2016-08-31		50
2016-11-15		79
2020-01-15		40
2016-09-20		❌
<iframe sandbox="allow-same-origin">5
2010-05-25		≤49
2016-09-20		79
2020-01-15		15
2013-07-02		5
2010-06-07
<iframe sandbox="allow-scripts">5
2010-05-25		≤49
2016-09-20		79
2020-01-15		15
2013-07-02		5
2010-06-07
<iframe sandbox="allow-top-navigation">6
2010-09-02		≤49
2016-09-20		79
2020-01-15		15
2013-07-02		5
2010-06-07
<iframe sandbox="allow-top-navigation-by-user-activation">58
2017-04-19		79
2020-07-28		79
2020-01-15		45
2017-05-10		11.1
2018-04-12
<iframe sandbox="allow-top-navigation-to-custom-protocols">❌101
2022-05-31		❌❌16
2022-09-12

Osadzenie kodu HTML w ramce lokalnej <iframe srcdoc>

Jak bez użycia JavaScript wygenerować zawartość ramki lokalnej bez wczytywania do niej żadnej strony?


Chrome
Firefox
Edge
Opera
Safari
<iframe srcdoc>20
2012-06-26		25
2013-10-29		79
2020-01-15		15
2013-07-02		6
2012-07-25

Zawijanie tekstu w formularzu <textarea wrap>

W jaki sposób wymusić wysłanie tekstu dokładnie w taki sposób, jak wyglądał podczas wypełniania formularza HTML?

❌ Nie działa

Chrome
Firefox
Edge
Opera
Safari
<textarea wrap>16
2011-12-13		4
2011-03-22		12
2015-07-29		≤12.1
2012-11-20		6
2012-07-25
<textarea wrap="hard">16
2011-12-13		❌12
2015-07-29		15
2013-07-02		❌

Komendy HTML 4.01

ACRONYM


Chrome
Firefox
Edge
Opera
Safari
<acronym>1
2008-12-11		1
2004-11-09		12
2015-07-29		15
2013-07-02		1
2003-06-23

BASE


Chrome
Firefox
Edge
Opera
Safari
<base>1
2008-12-11		1
2004-11-09		12
2015-07-29		15
2013-07-02		3
2007-10-26
<base href>1
2008-12-11		1
2004-11-09		12
2015-07-29		15
2013-07-02		3
2007-10-26
<base target>1
2008-12-11		1
2004-11-09		12
2015-07-29		15
2013-07-02		3
2007-10-26

BDO


Chrome
Firefox
Edge
Opera
Safari
<bdo>≤15
2011-10-25		10
2012-01-31		12
2015-07-29		15
2013-07-02		≤4
2009-06-08

BIG


Chrome
Firefox
Edge
Opera
Safari
<big>1
2008-12-11		1
2004-11-09		12
2015-07-29		15
2013-07-02		≤4
2009-06-08

CENTER


Chrome
Firefox
Edge
Opera
Safari
<center>1
2008-12-11		1
2004-11-09		12
2015-07-29		15
2013-07-02		≤4
2009-06-08

DIR


Chrome
Firefox
Edge
Opera
Safari
<dir>1
2008-12-11		1
2004-11-09		12
2015-07-29		≤12.1
2012-11-20		≤4
2009-06-08

FONT


Chrome
Firefox
Edge
Opera
Safari
<font>1
2008-12-11		1
2004-11-09		12
2015-07-29		15
2013-07-02		≤4
2009-06-08
<font color>1
2008-12-11		1
2004-11-09		12
2015-07-29		15
2013-07-02		≤4
2009-06-08
<font face>1
2008-12-11		1
2004-11-09		12
2015-07-29		15
2013-07-02		≤4
2009-06-08
<font size>1
2008-12-11		1
2004-11-09		12
2015-07-29		15
2013-07-02		≤4
2009-06-08

FRAME


Chrome
Firefox
Edge
Opera
Safari
<frame>1
2008-12-11		1
2004-11-09		12
2015-07-29		15
2013-07-02		3
2007-10-26
<frame frameborder>1
2008-12-11		1
2004-11-09		12
2015-07-29		15
2013-07-02		3
2007-10-26
<frame marginheight>1
2008-12-11		1
2004-11-09		12
2015-07-29		15
2013-07-02		3
2007-10-26
<frame marginwidth>1
2008-12-11		1
2004-11-09		12
2015-07-29		15
2013-07-02		3
2007-10-26
<frame name>1
2008-12-11		1
2004-11-09		12
2015-07-29		15
2013-07-02		3
2007-10-26
<frame noresize>1
2008-12-11		1
2004-11-09		12
2015-07-29		15
2013-07-02		3
2007-10-26
<frame scrolling>1
2008-12-11		1
2004-11-09		12
2015-07-29		15
2013-07-02		3
2007-10-26
<frame src>1
2008-12-11		1
2004-11-09		12
2015-07-29		15
2013-07-02		3
2007-10-26

FRAMESET


Chrome
Firefox
Edge
Opera
Safari
<frameset>1
2008-12-11		1
2004-11-09		12
2015-07-29		15
2013-07-02		3
2007-10-26
<frameset cols>1
2008-12-11		1
2004-11-09		12
2015-07-29		15
2013-07-02		3
2007-10-26
<frameset rows>1
2008-12-11		1
2004-11-09		12
2015-07-29		15
2013-07-02		3
2007-10-26

LINK


Chrome
Firefox
Edge
Opera
Safari
<link>1
2008-12-11		1
2004-11-09		12
2015-07-29		≤12.1
2012-11-20		≤4
2009-06-08
<link charset>1
2008-12-11		1
2004-11-09		12
2015-07-29		≤12.1
2012-11-20		≤4
2009-06-08
<link href>1
2008-12-11		1
2004-11-09		12
2015-07-29		≤12.1
2012-11-20		≤4
2009-06-08
<link hreflang>1
2008-12-11		1
2004-11-09		12
2015-07-29		≤12.1
2012-11-20		≤4
2009-06-08
<link media>1
2008-12-11		1
2004-11-09		12
2015-07-29		≤12.1
2012-11-20		≤4
2009-06-08
<link rel>1
2008-12-11		1
2004-11-09		12
2015-07-29		9
2006-06-20		1
2003-06-23
<link rev>1
2008-12-11		1
2004-11-09		12
2015-07-29		≤12.1
2012-11-20		≤4
2009-06-08
<link target>1
2008-12-11		1
2004-11-09		12
2015-07-29		≤12.1
2012-11-20		≤4
2009-06-08
<link type>1
2008-12-11		1
2004-11-09		12
2015-07-29		≤12.1
2012-11-20		≤4
2009-06-08

MENU


Chrome
Firefox
Edge
Opera
Safari
<menu>1
2008-12-11		1
2004-11-09		12
2015-07-29		≤12.1
2012-11-20		3
2007-10-26

NOFRAMES


Chrome
Firefox
Edge
Opera
Safari
<noframes>1
2008-12-11		1
2004-11-09		12
2015-07-29		15
2013-07-02		3
2007-10-26

NOSCRIPT


Chrome
Firefox
Edge
Opera
Safari
<noscript>1
2008-12-11		1
2004-11-09		12
2015-07-29		15
2013-07-02		3
2007-10-26

PARAM


Chrome
Firefox
Edge
Opera
Safari
<param>1
2008-12-11		1
2004-11-09		12
2015-07-29		15
2013-07-02		≤4
2009-06-08
<param name>1
2008-12-11		1
2004-11-09		12
2015-07-29		15
2013-07-02		≤4
2009-06-08
<param type>1
2008-12-11		1
2004-11-09		12
2015-07-29		15
2013-07-02		≤4
2009-06-08
<param value>1
2008-12-11		1
2004-11-09		12
2015-07-29		15
2013-07-02		≤4
2009-06-08
<param valuetype>1
2008-12-11		1
2004-11-09		12
2015-07-29		15
2013-07-02		≤4
2009-06-08

STRIKE


Chrome
Firefox
Edge
Opera
Safari
<strike>1
2008-12-11		1
2004-11-09		12
2015-07-29		15
2013-07-02		≤4
2009-06-08

TT


Chrome
Firefox
Edge
Opera
Safari
<tt>1
2008-12-11		1
2004-11-09		12
2015-07-29		15
2013-07-02		≤4
2009-06-08

CSS

Wstawianie stylów CSS

Styl lokalny <... style>

W jaki sposób bezpośrednio przypisać styl do dowolnego znacznika?


Chrome
Firefox
Edge
Opera
Safari
style1
2008-12-11		1
2004-11-09		12
2015-07-29		15
2013-07-02		1
2003-06-23

Rozciąganie stylu <span style>

W jaki sposób objąć stylem kilka elementów tekstowych?


Chrome
Firefox
Edge
Opera
Safari
<span>1
2008-12-11		1
2004-11-09		12
2015-07-29		15
2013-07-02		1
2003-06-23
<span style>1
2008-12-11		1
2004-11-09		12
2015-07-29		15
2013-07-02		1
2003-06-23

Wydzielone bloki <div style>

W jaki sposób objąć stylem grupę elementów blokowych?


Chrome
Firefox
Edge
Opera
Safari
<div>1
2008-12-11		1
2004-11-09		12
2015-07-29		15
2013-07-02		1
2003-06-23
<div style>1
2008-12-11		1
2004-11-09		12
2015-07-29		15
2013-07-02		1
2003-06-23

Wewnętrzny arkusz stylów <style>

Jak osadzić arkusz stylów CSS bezpośrednio w dokumencie?


Chrome
Firefox
Edge
Opera
Safari
<style>1
2008-12-11		1
2004-11-09		12
2015-07-29		3.5
1998-11-18		1
2003-06-23

Zewnętrzny arkusz stylów <link "stylesheet"> @charset

Jak dołączyć arkusz stylów CSS z zewnętrznego pliku?


Chrome
Firefox
Edge
Opera
Safari
@charset2
2009-05-21		1.5
2005-11-29		12
2015-07-29		9
2006-06-20		4
2009-06-08

Import arkusza stylów @import

Jak zaimportować arkusz stylów z zewnętrznego dokumentu?


Chrome
Firefox
Edge
Opera
Safari
@import1
2008-12-11		1
2004-11-09		12
2015-07-29		3.5
1998-11-18		1
2003-06-23

Dziedziczenie stylów CSS

Przywrócenie wartości domyślnej {...: initial}

Jak przywrócić domyślne formatowanie elementów na stronie?


Chrome
Firefox
Edge
Opera
Safari
initial1
2008-12-11		19
2013-02-19		13
2015-11-12		15
2013-07-02		1.2
2004-02-02

Wymuszenie dziedziczenia {...: inherit}

W jaki sposób wymusić przywrócenie dziedziczenia stylów CSS?


Chrome
Firefox
Edge
Opera
Safari
inherit1
2008-12-11		1
2004-11-09		12
2015-07-29		4
2000-06-28		1
2003-06-23

Odwołanie wartości {...: unset}

Jak odwołać formatowanie wcześniej przypisane do elementu na stronie?


Chrome
Firefox
Edge
Opera
Safari
unset41
2015-03-03		27
2014-02-04		13
2015-11-12		28
2015-03-10		9.1
2016-03-21

Przywrócenie wartości pierwotnej {...: revert}

Jak przywrócić pierwotny wygląd wybranemu elementowi na stronie?


Chrome
Firefox
Edge
Opera
Safari
revert84
2020-07-27		67
2019-05-21		84
2020-07-16		70
2020-07-27		9.1
2016-03-21

Resetowanie wszystkich wartości {all}

W jaki sposób zresetować (wyczyścić, usunąć) całe formatowanie wybranemu elementowi na stronie?


Chrome
Firefox
Edge
Opera
Safari
all: wartość37
2014-08-26		27
2014-02-04		79
2020-01-15		24
2014-09-02		9.1
2016-03-21

Selektory elementów CSS

Selektor typu

Jak utworzyć selektor typu - podstawowy rodzaj selektora CSS?


Chrome
Firefox
Edge
Opera
Safari
selektor1
2008-12-11		1
2004-11-09		12
2015-07-29		3.5
1998-11-18		1
2003-06-23

Selektor uniwersalny

W jaki sposób przypisać styl do wszystkich elementów?


Chrome
Firefox
Edge
Opera
Safari
*1
2008-12-11		1
2004-11-09		12
2015-07-29		3.5
1998-11-18		1
2003-06-23

Selektor potomka

W jaki sposób nadać formatowanie znacznikom potomków znajdującym się wewnątrz innego elementu - przodka?


Chrome
Firefox
Edge
Opera
Safari
przodek potomek1
2008-12-11		1
2004-11-09		12
2015-07-29		3.5
1998-11-18		1
2003-06-23

Selektor dziecka

W jaki sposób nadać formatowanie znacznikowi dziecka znajdującemu się bezpośrednio wewnątrz elementu rodzica?


Chrome
Firefox
Edge
Opera
Safari
rodzic > dziecko1
2008-12-11		1
2004-11-09		12
2015-07-29		4
2000-06-28		1
2003-06-23

Selektor braci

W jaki sposób nadać formatowanie znacznikowi znajdującemu się bezpośrednio po innym elemencie - bracie?


Chrome
Firefox
Edge
Opera
Safari
brat1 + brat21
2008-12-11		1
2004-11-09		12
2015-07-29		3.5
1998-11-18		1
2003-06-23

Ogólny selektor braci

W jaki sposób nadać formatowanie znacznikom znajdującym się w dowolnym miejscu po innym elemencie - bracie?


Chrome
Firefox
Edge
Opera
Safari
brat1 ~ brat21
2008-12-11		1
2004-11-09		12
2015-07-29		9
2006-06-20		3
2007-10-26

Selektory atrybutów CSS

Prosty selektor atrybutu

W jaki sposób określić formatowanie elementu, który posiada określony atrybut?


Chrome
Firefox
Edge
Opera
Safari
[atrybut]1
2008-12-11		1
2004-11-09		12
2015-07-29		9
2006-06-20		3
2007-10-26

Selektor atrybutu o określonej wartości

W jaki sposób określić formatowanie elementu, który posiada określony atrybut o odpowiedniej wartości?


Chrome
Firefox
Edge
Opera
Safari
[atrybut="wartość atrybutu"]1
2008-12-11		1
2004-11-09		12
2015-07-29		9
2006-06-20		3
2007-10-26

Selektor atrybutu zawierającego określony wyraz

W jaki sposób określić formatowanie elementu, który posiada określony atrybut zawierający podany wyraz?


Chrome
Firefox
Edge
Opera
Safari
[atrybut~="wyraz"]1
2008-12-11		1
2004-11-09		12
2015-07-29		9
2006-06-20		3
2007-10-26

Selektor atrybutu zawierającego łączniki

Jak zmienić wygląd elementów, które mają podane atrybuty z określonymi łącznikami, np. "en-US"?


Chrome
Firefox
Edge
Opera
Safari
[atrybut|="początek"]1
2008-12-11		1
2004-11-09		12
2015-07-29		9
2006-06-20		3
2007-10-26

Selektory specjalne CSS

Klasy selektorów <... class>

W jaki sposób przypisać do dowolnego elementu zbiór reguł formatujących, znajdujących się w jednym miejscu, oszczędzając sobie tym samym pisania? Jak przypisać kilka klas CSS do jednego elementu? Co to są podzbiory klas CSS?


Chrome
Firefox
Edge
Opera
Safari
.klasa1
2008-12-11		1
2004-11-09		12
2015-07-29		3.5
1998-11-18		1
2003-06-23

Selektor identyfikatora <... id>

W jaki sposób określić specjalny wygląd pojedynczego elementu na stronie WWW?


Chrome
Firefox
Edge
Opera
Safari
#identyfikator1
2008-12-11		1
2004-11-09		12
2015-07-29		3.5
1998-11-18		1
2003-06-23

Selektory pseudoelementów CSS

Pierwsza linia :first-line

W jaki sposób zmienić wygląd pierwszej linii tekstu?


Chrome
Firefox
Edge
Opera
Safari
:first-line1
2008-12-11		1
2004-11-09		12
2015-07-29		7
2003-01-28		1
2003-06-23

Pierwsza litera :first-letter

W jaki sposób zmienić wygląd pierwszej litery tekstu?


Chrome
Firefox
Edge
Opera
Safari
:first-letter1
2008-12-11		1
2004-11-09		12
2015-07-29		7
2003-01-28		1
2003-06-23

Przed... :before

W jaki sposób wygenerować dynamicznie tekst przed określonym elementem?


Chrome
Firefox
Edge
Opera
Safari
:before1
2008-12-11		1.5
2005-11-29		12
2015-07-29		7
2003-01-28		4
2009-06-08

Po... :after

W jaki sposób wygenerować dynamicznie tekst po określonym elemencie?


Chrome
Firefox
Edge
Opera
Safari
:after1
2008-12-11		1.5
2005-11-29		12
2015-07-29		7
2003-01-28		4
2009-06-08

Cudzysłowy {quotes}

W jaki sposób kontrolować wygląd cudzysłowów? Jak powinno się wpisywać cytaty zagnieżdżone w języku polskim?


Chrome
Firefox
Edge
Opera
Safari
quotes: wartość11
2011-04-27		1.5
2005-11-29		12
2015-07-29		4
2000-06-28		9
2015-09-30

Selektory pseudoklas CSS

Odsyłacz podstawowy :link

Jak zmienić wygląd odsyłaczy (odnośników hipertekstowych, hiperłączy, linków)?


Chrome
Firefox
Edge
Opera
Safari
:link1
2008-12-11		1
2004-11-09		12
2015-07-29		3.5
1998-11-18		1
2003-06-23

Odsyłacz odwiedzony :visited

Jak zmienić wygląd odwiedzonych odsyłaczy (odnośników hipertekstowych, hiperłączy, linków)?


Chrome
Firefox
Edge
Opera
Safari
:visited1
2008-12-11		1
2004-11-09		12
2015-07-29		3.5
1998-11-18		1
2003-06-23

Aktywacja :active

Jak zmienić wygląd aktywnych elementów - np. odsyłaczy (odnośników hipertekstowych, hiperłączy, linków)?


Chrome
Firefox
Edge
Opera
Safari
:active1
2008-12-11		1
2004-11-09		12
2015-07-29		5
2000-12-06		1
2003-06-23

Wskazanie myszką :hover

Jak zrobić podświetlany link (odsyłacz, odnośnik hipertekstowy, hiperłacze)?


Chrome
Firefox
Edge
Opera
Safari
:hover1
2008-12-11		1
2004-11-09		12
2015-07-29		4
2000-06-28		2
2005-04-29

Zogniskowanie :focus

Jak zmienić wygląd pola tekstowego formularza po wybraniu przez użytkownika?


Chrome
Firefox
Edge
Opera
Safari
:focus1
2008-12-11		1
2004-11-09		12
2015-07-29		7
2003-01-28		1
2003-06-23

Atrybut języka :lang

W jaki sposób zmienić wygląd elementów, zawierających tekst w wybranym języku?


Chrome
Firefox
Edge
Opera
Safari
:lang1
2008-12-11		1
2004-11-09		12
2015-07-29		8
2005-04-19		3.1
2008-03-18

Pierwsze dziecko :first-child

Jak zmienić wygląd pierwszego elementu dziecka, znajdującego się wewnątrz znacznika rodzica?


Chrome
Firefox
Edge
Opera
Safari
:first-child4
2010-01-25		3
2008-06-17		12
2015-07-29		9.5
2008-06-12		3.1
2008-03-18

Ostatnie dziecko :last-child

Jak zmienić wygląd ostatniego elementu dziecka, znajdującego się wewnątrz znacznika rodzica?


Chrome
Firefox
Edge
Opera
Safari
:last-child1
2008-12-11		1
2004-11-09		12
2015-07-29		9.5
2008-06-12		3.1
2008-03-18

Jedyne dziecko :only-child

Jak zmienić wygląd elementu dziecka, który nie ma braci?


Chrome
Firefox
Edge
Opera
Safari
:only-child2
2009-05-21		1.5
2005-11-29		12
2015-07-29		9.5
2008-06-12		3.1
2008-03-18

Pseudoklasy typu :first-of-type :last-of-type :only-of-type

W jaki sposób zmienić wygląd tylko pierwszego elementu określonego typu?


Chrome
Firefox
Edge
Opera
Safari
:first-of-type1
2008-12-11		3.5
2009-06-30		12
2015-07-29		9.5
2008-06-12		3.1
2008-03-18
:last-of-type1
2008-12-11		3.5
2009-06-30		12
2015-07-29		9.5
2008-06-12		3.1
2008-03-18
:only-of-type1
2008-12-11		3.5
2009-06-30		12
2015-07-29		9.5
2008-06-12		3.1
2008-03-18

Etykieta :target

Jak zmienić wygląd odnośników (odsyłaczy, linków) do etykiety (kotwica)?


Chrome
Firefox
Edge
Opera
Safari
:target1
2008-12-11		1
2004-11-09		12
2015-07-29		9.5
2008-06-12		1.3
2005-04-15

Blokada :disabled :enabled

Jak zmienić wygląd pól (kontrolek) formularza, które są zablokowane (wyszarzone)?


Chrome
Firefox
Edge
Opera
Safari
:enabled1
2008-12-11		1
2004-11-09		12
2015-07-29		9
2006-06-20		3.1
2008-03-18
:disabled1
2008-12-11		1
2004-11-09		12
2015-07-29		9
2006-06-20		3.1
2008-03-18

Tylko do odczytu :read-only :read-write

Jak zmienić wygląd pól (kontrolek) formularza, które są zablokowane do zapisu?


Chrome
Firefox
Edge
Opera
Safari
:read-only1
2008-12-11		78
2020-06-30		13
2015-11-12		9
2006-06-20		4
2009-06-08
:read-write1
2008-12-11		78
2020-06-30		13
2015-11-12		9
2006-06-20		4
2009-06-08

Zaznaczenie :checked

Jak zmienić wygląd pól (kontrolek) formularza, które są zaznaczone?


Chrome
Firefox
Edge
Opera
Safari
:checked1
2008-12-11		1
2004-11-09		12
2015-07-29		9
2006-06-20		3.1
2008-03-18

Domyślne :default

Jak zmienić wygląd domyślnego przycisku formularza lub domyślnej opcji do wyboru?


Chrome
Firefox
Edge
Opera
Safari
:default10
2011-03-08		4
2011-03-22		79
2020-01-15		10
2009-09-01		5
2010-06-07

Pusty element :empty

W jaki sposób zmienić sposób formatowania elementów, które nie zawierają żadnej treści?


Chrome
Firefox
Edge
Opera
Safari
:empty1
2008-12-11		1
2004-11-09		12
2015-07-29		9.5
2008-06-12		3.1
2008-03-18

Korzeń :root

W jaki sposób za pomocą CSS odnieść się do korzenia drzewa dokumentu?


Chrome
Firefox
Edge
Opera
Safari
:root1
2008-12-11		1
2004-11-09		12
2015-07-29		9.5
2008-06-12		1
2003-06-23

Pseudoklasy cykliczne :nth-child :nth-last-child :nth-of-type :nth-last-of-type

Jak zmienić wygląd parzystych lub nieparzystych wierszy tabeli? Jak pokolorować co trzeci wiersz?


Chrome
Firefox
Edge
Opera
Safari
:nth-child1
2008-12-11		3.5
2009-06-30		12
2015-07-29		9.5
2008-06-12		3.1
2008-03-18
:nth-last-child4
2010-01-25		3.5
2009-06-30		12
2015-07-29		9
2006-06-20		3.1
2008-03-18
:nth-of-type1
2008-12-11		3.5
2009-06-30		12
2015-07-29		9.5
2008-06-12		3.1
2008-03-18
:nth-last-of-type4
2010-01-25		3.5
2009-06-30		12
2015-07-29		9.5
2008-06-12		3.1
2008-03-18

Negacja :not

W jaki sposób zmienić wygląd wszystkich elementów z wyjątkiem podanych?


Chrome
Firefox
Edge
Opera
Safari
:not1
2008-12-11		1
2004-11-09		12
2015-07-29		9.5
2008-06-12		3.1
2008-03-18

Czcionki CSS

Wielkość czcionki {font-size}

Jak zmienić rozmiar (wielkość) czcionki? Jaki jest najlepszy sposób ustalania wielkości czcionki?


Chrome
Firefox
Edge
Opera
Safari
font-size: wartość1
2008-12-11		1
2004-11-09		12
2015-07-29		7
2003-01-28		1
2003-06-23

Rodzaj czcionki {font-family}

Jak zmienić rodzaj (krój) czcionki? W jaki sposób maksymalnie zabezpieczyć się przed wyświetleniem tekstu niechcianym krojem czcionki?


Chrome
Firefox
Edge
Opera
Safari
font-family: wartość1
2008-12-11		1
2004-11-09		12
2015-07-29		3.5
1998-11-18		1
2003-06-23

Czcionki osadzone @font-face

W jaki sposób wczytać czcionkę z pliku?


Chrome
Firefox
Edge
Opera
Safari
@font-face1
2008-12-11		3.5
2009-06-30		12
2015-07-29		10
2009-09-01		3.1
2008-03-18
@font-face { src: url(*.woff) }6
2010-09-02		3.5
2009-06-30		12
2015-07-29		11.1
2011-04-12		5.1
2011-07-20
@font-face { font-family: wartość }4
2010-01-25		3.5
2009-06-30		12
2015-07-29		10
2009-09-01		3.1
2008-03-18
@font-face { src: wartość }4
2010-01-25		3.5
2009-06-30		12
2015-07-29		10
2009-09-01		3.1
2008-03-18

Styl czcionki {font-style}

W jaki sposób wprowadzić czcionkę pochyloną (kursywa)? Czym różni się styl "italic" od "oblique"?


Chrome
Firefox
Edge
Opera
Safari
font-style: wartość1
2008-12-11		1
2004-11-09		12
2015-07-29		7
2003-01-28		1
2003-06-23
font-style: italic1
2008-12-11		1
2004-11-09		12
2015-07-29		15
2013-07-02		1
2003-06-23
font-style: normal1
2008-12-11		1
2004-11-09		12
2015-07-29		15
2013-07-02		1
2003-06-23

Waga czcionki {font-weight}

Jak wprowadzić czcionkę pogrubioną? Czy można wytłuścić tekst z różną intensywnością?


Chrome
Firefox
Edge
Opera
Safari
font-weight: wartość2
2009-05-21		1
2004-11-09		12
2015-07-29		3.5
1998-11-18		1
2003-06-23
font-weight: bold2
2009-05-21		1
2004-11-09		12
2015-07-29		15
2013-07-02		1
2003-06-23
font-weight: bolder2
2009-05-21		1
2004-11-09		12
2015-07-29		15
2013-07-02		1
2003-06-23
font-weight: lighter2
2009-05-21		1
2004-11-09		12
2015-07-29		15
2013-07-02		1
2003-06-23
font-weight: normal2
2009-05-21		1
2004-11-09		12
2015-07-29		15
2013-07-02		1
2003-06-23

Wariant wielkości liter czcionki {font-variant-caps}

W jaki sposób przekształcić zwykły tekst w kapitaliki, czyli napisany wielkimi literami, lecz czcionką o wysokości małych liter?


Chrome
Firefox
Edge
Opera
Safari
font-variant-caps: wartość52
2016-07-20		34
2014-12-01		79
2020-01-15		39
2016-08-02		9.1
2016-03-21
font-variant-caps: all-petite-caps52
2016-07-20		34
2014-12-01		79
2020-01-15		39
2016-08-02		9.1
2016-03-21
font-variant-caps: all-small-caps52
2016-07-20		34
2014-12-01		79
2020-01-15		39
2016-08-02		9.1
2016-03-21
font-variant-caps: normal52
2016-07-20		34
2014-12-01		79
2020-01-15		39
2016-08-02		9.1
2016-03-21
font-variant-caps: petite-caps52
2016-07-20		34
2014-12-01		79
2020-01-15		39
2016-08-02		9.1
2016-03-21
font-variant-caps: small-caps52
2016-07-20		34
2014-12-01		79
2020-01-15		39
2016-08-02		9.1
2016-03-21
font-variant-caps: titling-caps52
2016-07-20		34
2014-12-01		79
2020-01-15		39
2016-08-02		9.1
2016-03-21
font-variant-caps: unicase52
2016-07-20		34
2014-12-01		79
2020-01-15		39
2016-08-02		9.1
2016-03-21

Wariant połączenia znaków czcionki {font-variant-ligatures}

W jaki sposób sprawić, aby niektóre litery w tekście były ze sobą bardziej zlane tworząc estetyczne połączenie graficzne (ligatury)?


Chrome
Firefox
Edge
Opera
Safari
font-variant-ligatures: wartość34
2014-04-08		34
2014-12-01		79
2020-01-15		21
2014-05-06		9.1
2016-03-21
font-variant-ligatures: common-ligatures31
2013-11-12		34
2014-12-01		79
2020-01-15		18
2013-11-19		7
2013-10-22
font-variant-ligatures: contextual31
2013-11-12		34
2014-12-01		79
2020-01-15		18
2013-11-19		7
2013-10-22
font-variant-ligatures: discretionary-ligatures31
2013-11-12		34
2014-12-01		79
2020-01-15		18
2013-11-19		7
2013-10-22
font-variant-ligatures: historical-ligatures31
2013-11-12		34
2014-12-01		79
2020-01-15		18
2013-11-19		7
2013-10-22
font-variant-ligatures: no-common-ligatures31
2013-11-12		34
2014-12-01		79
2020-01-15		18
2013-11-19		7
2013-10-22
font-variant-ligatures: no-contextual31
2013-11-12		34
2014-12-01		79
2020-01-15		18
2013-11-19		7
2013-10-22
font-variant-ligatures: no-discretionary-ligatures31
2013-11-12		34
2014-12-01		79
2020-01-15		18
2013-11-19		7
2013-10-22
font-variant-ligatures: no-historical-ligatures31
2013-11-12		34
2014-12-01		79
2020-01-15		18
2013-11-19		7
2013-10-22
font-variant-ligatures: none31
2013-11-12		34
2014-12-01		79
2020-01-15		18
2013-11-19		7
2013-10-22
font-variant-ligatures: normal31
2013-11-12		34
2014-12-01		79
2020-01-15		18
2013-11-19		7
2013-10-22

Wariant liczb czcionki {font-variant-numeric}

Co zrobić, aby liczby w kolumnach tabeli z danymi były ułożone równo pod sobą? W jaki sposób wyświetlić licznik i mianownik rozdzielone kreską ułamkową?


Chrome
Firefox
Edge
Opera
Safari
font-variant-numeric: wartość52
2016-07-20		34
2014-12-01		79
2020-01-15		39
2016-08-02		9.1
2016-03-21
font-variant-numeric: diagonal-fractions52
2016-07-20		34
2014-12-01		79
2020-01-15		39
2016-08-02		9.1
2016-03-21
font-variant-numeric: lining-nums52
2016-07-20		34
2014-12-01		79
2020-01-15		39
2016-08-02		9.1
2016-03-21
font-variant-numeric: normal52
2016-07-20		34
2014-12-01		79
2020-01-15		39
2016-08-02		9.1
2016-03-21
font-variant-numeric: oldstyle-nums52
2016-07-20		34
2014-12-01		79
2020-01-15		39
2016-08-02		9.1
2016-03-21
font-variant-numeric: ordinal52
2016-07-20		34
2014-12-01		79
2020-01-15		39
2016-08-02		9.1
2016-03-21
font-variant-numeric: proportional-nums52
2016-07-20		34
2014-12-01		79
2020-01-15		39
2016-08-02		9.1
2016-03-21
font-variant-numeric: slashed-zero52
2016-07-20		34
2014-12-01		79
2020-01-15		39
2016-08-02		9.1
2016-03-21
font-variant-numeric: stacked-fractions52
2016-07-20		34
2014-12-01		79
2020-01-15		39
2016-08-02		9.1
2016-03-21
font-variant-numeric: tabular-nums52
2016-07-20		34
2014-12-01		79
2020-01-15		39
2016-08-02		9.1
2016-03-21

Wariant pozycji czcionki {font-variant-position}

W jaki sposób dodać indeks dolny lub górny tak, aby sąsiednie linijki tekstu nie były między sobą nieestetycznie rozsunięte?

❌ Nie działa

Chrome
Firefox
Edge
Opera
Safari
font-variant-position: wartość❌34
2014-12-01		❌❌9.1
2016-03-21
font-variant-position: normal❌34
2014-12-01		❌❌9.1
2016-03-21
font-variant-position: sub❌34
2014-12-01		❌❌9.1
2016-03-21
font-variant-position: super❌34
2014-12-01		❌❌9.1
2016-03-21

Atrybuty mieszane wariantu czcionki {font-variant}

W jaki sposób określić w jednym poleceniu wiele własności wariantu czcionki: połączenie liter (ligatury), wielkość liter (kapitaliki), formatowanie liczb oraz wyglądu indeksów dolnych i górnych w tekście?


Chrome
Firefox
Edge
Opera
Safari
font-variant: wartość1
2008-12-11		1
2004-11-09		12
2015-07-29		3.5
1998-11-18		1
2003-06-23
font-variant: none52
2016-07-20		34
2014-12-01		79
2020-01-15		39
2016-08-02		9
2015-09-30
font-variant: normal1
2008-12-11		1
2004-11-09		12
2015-07-29		15
2013-07-02		1
2003-06-23

Atrybuty mieszane czcionki {font}

W jaki sposób określić w jednym poleceniu wiele własności czcionki: styl, wariant, wagę, rozmiar, krój, a także wysokość linii? Jak ustawić czcionkę systemową, tzn. taką jak używana na przyciskach, paskach narzędzi, menu itp.?


Chrome
Firefox
Edge
Opera
Safari
font: wartość1
2008-12-11		1
2004-11-09		12
2015-07-29		3.5
1998-11-18		1
2003-06-23
font: caption1
2008-12-11		1
2004-11-09		12
2015-07-29		6
2001-12-18		1
2003-06-23
font: icon1
2008-12-11		1
2004-11-09		12
2015-07-29		6
2001-12-18		1
2003-06-23
font: menu1
2008-12-11		1
2004-11-09		12
2015-07-29		6
2001-12-18		1
2003-06-23
font: message-box1
2008-12-11		1
2004-11-09		12
2015-07-29		6
2001-12-18		1
2003-06-23
font: small-caption1
2008-12-11		1
2004-11-09		12
2015-07-29		6
2001-12-18		1
2003-06-23
font: status-bar1
2008-12-11		1
2004-11-09		12
2015-07-29		6
2001-12-18		1
2003-06-23

Rozciągnięcie czcionki {font-stretch}

W jaki sposób rozciągnąć lub ścieśnić czcionkę?


Chrome
Firefox
Edge
Opera
Safari
font-stretch: wartość60
2017-07-25		9
2011-12-20		12
2015-07-29		47
2017-08-09		11
2017-09-19

Proporcje czcionki {font-size-adjust}

Co zrobić, aby czcionka na ekranie zawsze była tak samo czytelna, bez względu na jej krój (rodzaj)?


Chrome
Firefox
Edge
Opera
Safari
font-size-adjust: wartość127
2024-07-23		3
2008-06-17		127
2024-07-25		113
2024-08-22		16.4
2023-03-27

Odległość między znakami czcionki {font-kerning}

W jaki sposób regulować odległość pomiędzy sąsiednimi znakami tekstu (kerning) tak, aby wyglądał bardziej estetycznie i był czytelniejszy?


Chrome
Firefox
Edge
Opera
Safari
font-kerning: wartość33
2014-02-20		32
2014-09-02		79
2020-01-15		20
2014-03-04		9
2015-09-30
font-kerning: auto33
2014-02-20		32
2014-09-02		79
2020-01-15		20
2014-03-04		9
2015-09-30
font-kerning: none33
2014-02-20		32
2014-09-02		79
2020-01-15		20
2014-03-04		9
2015-09-30
font-kerning: normal33
2014-02-20		32
2014-09-02		79
2020-01-15		20
2014-03-04		9
2015-09-30

Tekst CSS

Kolor tekstu {color}

Jak zmienić kolor tekstu w dowolnym elemencie?


Chrome
Firefox
Edge
Opera
Safari
color: wartość1
2008-12-11		1
2004-11-09		12
2015-07-29		3.5
1998-11-18		1
2003-06-23

Dekoracja tekstu {text-decoration}

Co zrobić, aby ten sam tekst został podkreślony, przekreślony i nadkreślony? Jak wprowadzić migający tekst w sposób zgodny ze standardem?


Chrome
Firefox
Edge
Opera
Safari
text-decoration: wartość1
2008-12-11		1
2004-11-09		12
2015-07-29		3.5
1998-11-18		1
2003-06-23

Transformacja tekstu {text-transform}

W jaki sposób przekształcić zwykły tekst na pisany w całości dużymi albo małymi literami? Jak zmienić pierwsze litery wszystkich wyrazów na wielkie?


Chrome
Firefox
Edge
Opera
Safari
text-transform: wartość1
2008-12-11		1
2004-11-09		12
2015-07-29		7
2003-01-28		1
2003-06-23
text-transform: capitalize1
2008-12-11		1
2004-11-09		12
2015-07-29		7
2003-01-28		1
2003-06-23
text-transform: lowercase1
2008-12-11		1
2004-11-09		12
2015-07-29		15
2013-07-02		1
2003-06-23
text-transform: none1
2008-12-11		1
2004-11-09		12
2015-07-29		15
2013-07-02		1
2003-06-23
text-transform: uppercase1
2008-12-11		1
2004-11-09		12
2015-07-29		15
2013-07-02		1
2003-06-23

Wyrównanie tekstu {text-align}

Jak ustawić tekst po lewej, po prawej lub na środku (wyśrodkowanie, centrowanie)? Co zrobić, aby tekst był równo ułożony przy obu marginesach (justowanie)?


Chrome
Firefox
Edge
Opera
Safari
text-align: wartość1
2008-12-11		1
2004-11-09		12
2015-07-29		3.5
1998-11-18		1
2003-06-23
text-align: center1
2008-12-11		1
2004-11-09		79
2020-01-15		15
2013-07-02		≤4
2009-06-08
text-align: justify1
2008-12-11		1
2004-11-09		12
2015-07-29		15
2013-07-02		1
2003-06-23
text-align: left1
2008-12-11		1
2004-11-09		79
2020-01-15		15
2013-07-02		≤4
2009-06-08
text-align: right1
2008-12-11		1
2004-11-09		79
2020-01-15		15
2013-07-02		≤4
2009-06-08

Wcięcie w tekście {text-indent}

W jaki sposób prawidłowo dodawać wcięcia w akapitach?


Chrome
Firefox
Edge
Opera
Safari
text-indent: wartość1
2008-12-11		1
2004-11-09		12
2015-07-29		3.5
1998-11-18		1
2003-06-23

Cień pod tekstem {text-shadow}

Jak można by było dodać cień pod tekstem?


Chrome
Firefox
Edge
Opera
Safari
text-shadow: wartość2
2009-05-21		3.5
2009-06-30		12
2015-07-29		9.5
2008-06-12		1.1
2003-10-24

Wysokość linii tekstu {line-height}

Jak zmienić odległość między linijkami tekstu (wysokość linii), tak aby stał się bardziej czytelny lub skondensowany?


Chrome
Firefox
Edge
Opera
Safari
line-height: wartość1
2008-12-11		1
2004-11-09		12
2015-07-29		7
2003-01-28		1
2003-06-23
line-height: normal1
2008-12-11		1
2004-11-09		12
2015-07-29		15
2013-07-02		1
2003-06-23

Odstęp między wyrazami tekstu {word-spacing}

Jak rozstrzelić lub ścieśnić tekst poprzez zwiększenie odległości między sąsiednimi wyrazami?


Chrome
Firefox
Edge
Opera
Safari
word-spacing: wartość1
2008-12-11		1
2004-11-09		12
2015-07-29		3.5
1998-11-18		1
2003-06-23
word-spacing: normal1
2008-12-11		1
2004-11-09		12
2015-07-29		3.5
1998-11-18		1
2003-06-23

Odstęp między literami tekstu {letter-spacing}

Jak rozstrzelić lub ścieśnić tekst poprzez zwiększenie odległości między literami?


Chrome
Firefox
Edge
Opera
Safari
letter-spacing: wartość1
2008-12-11		1
2004-11-09		12
2015-07-29		3.5
1998-11-18		1
2003-06-23
letter-spacing: normal1
2008-12-11		1
2004-11-09		12
2015-07-29		15
2013-07-02		1
2003-06-23

Białe znaki w tekście {white-space}

W jaki sposób zablokować zawijanie tekstu? Co zrobić, aby klawisze Enter i Tab były widoczne na ekranie?


Chrome
Firefox
Edge
Opera
Safari
white-space: wartość1
2008-12-11		1
2004-11-09		12
2015-07-29		4
2000-06-28		1
2003-06-23
white-space: normal1
2008-12-11		1
2004-11-09		12
2015-07-29		15
2013-07-02		1
2003-06-23
white-space: nowrap1
2008-12-11		1
2004-11-09		12
2015-07-29		4
2000-06-28		1
2003-06-23
white-space: pre1
2008-12-11		1
2004-11-09		12
2015-07-29		4
2000-06-28		1
2003-06-23
white-space: pre-line1
2008-12-11		3.5
2009-06-30		12
2015-07-29		9.5
2008-06-12		3
2007-10-26
white-space: pre-wrap1
2008-12-11		3
2008-06-17		12
2015-07-29		8
2005-04-19		3
2007-10-26

Tryb pisania {writing-mode}

Co zrobić, aby tekst na stronie był ułożony pionowo - z góry na dół?


Chrome
Firefox
Edge
Opera
Safari
writing-mode: wartość48
2016-01-20		41
2015-09-22		12
2015-07-29		35
2016-02-02		10.1
2017-03-27
writing-mode: horizontal-tb48
2016-01-20		43
2015-12-15		12
2015-07-29		35
2016-02-02		9
2015-09-30
writing-mode: vertical-lr48
2016-01-20		43
2015-12-15		12
2015-07-29		35
2016-02-02		9
2015-09-30
writing-mode: vertical-rl48
2016-01-20		43
2015-12-15		12
2015-07-29		35
2016-02-02		9
2015-09-30

Orientacja tekstu {text-orientation}

Co zrobić, aby znaki w tekście były ułożone pionowo jeden pod drugim?


Chrome
Firefox
Edge
Opera
Safari
text-orientation: wartość48
2016-01-20		41
2015-09-22		79
2020-01-15		35
2016-02-02		14
2020-09-16
text-orientation: mixed48
2016-01-20		41
2015-09-22		79
2020-01-15		35
2016-02-02		≤13.1
2020-03-24
text-orientation: sideways12
2011-06-07		44
2016-01-26		79
2020-01-15		15
2013-07-02		7
2013-10-22
text-orientation: upright12
2011-06-07		41
2015-09-22		79
2020-01-15		15
2013-07-02		≤13.1
2020-03-24

Tło CSS

Kolor tła {background-color}

Jak zmienić kolor tła dowolnego elementu?


Chrome
Firefox
Edge
Opera
Safari
background-color: wartość1
2008-12-11		1
2004-11-09		12
2015-07-29		3.5
1998-11-18		1
2003-06-23

Tło obrazkowe {background-image}

Jak ustawić tło graficzne (obrazek, zdjęcie) pod dowolnym elementem? Jak ustalić rozmiary obrazka w tle?


Chrome
Firefox
Edge
Opera
Safari
background-image: wartość1
2008-12-11		1
2004-11-09		12
2015-07-29		3.5
1998-11-18		1
2003-06-23
background-image: none1
2008-12-11		1
2004-11-09		12
2015-07-29		15
2013-07-02		1
2003-06-23
background-image: wartość /* multiple backgrounds */1
2008-12-11		3.6
2010-01-21		12
2015-07-29		10.5
2010-03-02		1.3
2005-04-15

Powtarzanie tła obrazkowego {background-repeat}

W jaki sposób zapobiec powielaniu grafiki wstawionej w tle albo powielić ją tylko w jednym kierunku (poziomo lub pionowo)?


Chrome
Firefox
Edge
Opera
Safari
background-repeat: wartość1
2008-12-11		1
2004-11-09		12
2015-07-29		3.5
1998-11-18		1
2003-06-23
background-repeat: no-repeat1
2008-12-11		1
2004-11-09		12
2015-07-29		15
2013-07-02		1
2003-06-23
background-repeat: repeat1
2008-12-11		1
2004-11-09		12
2015-07-29		15
2013-07-02		1
2003-06-23
background-repeat: repeat-x1
2008-12-11		1
2004-11-09		12
2015-07-29		15
2013-07-02		1
2003-06-23
background-repeat: repeat-y1
2008-12-11		1
2004-11-09		12
2015-07-29		15
2013-07-02		1
2003-06-23
background-repeat: round30
2013-10-01		49
2016-09-20		12
2015-07-29		17
2013-10-08		8
2014-10-16
background-repeat: space30
2013-10-01		49
2016-09-20		12
2015-07-29		17
2013-10-08		8
2014-10-16
background-repeat: wartość /* multiple backgrounds */1
2008-12-11		3.6
2010-01-21		12
2015-07-29		10.5
2010-03-02		1.3
2005-04-15

Pozycja tła obrazkowego {background-position}

Jak ustawić obrazek (grafikę, zdjęcie) w tle w określonej pozycji?


Chrome
Firefox
Edge
Opera
Safari
background-position: wartość1
2008-12-11		1
2004-11-09		12
2015-07-29		3.5
1998-11-18		1
2003-06-23
background-position: bottom1
2008-12-11		1
2004-11-09		79
2020-01-15		15
2013-07-02		1
2003-06-23
background-position: center1
2008-12-11		1
2004-11-09		79
2020-01-15		15
2013-07-02		1
2003-06-23
background-position: left1
2008-12-11		1
2004-11-09		79
2020-01-15		15
2013-07-02		1
2003-06-23
background-position: right1
2008-12-11		1
2004-11-09		79
2020-01-15		15
2013-07-02		1
2003-06-23
background-position: top1
2008-12-11		1
2004-11-09		79
2020-01-15		15
2013-07-02		1
2003-06-23
background-position: wartość /* multiple backgrounds */1
2008-12-11		3.6
2010-01-21		12
2015-07-29		10.5
2010-03-02		1.3
2005-04-15

Zaczepienie tła obrazkowego {background-attachment}

Jak zrobić tło graficzne (obrazek, zdjęcie), które nie przesuwa się przy przewijaniu strony?


Chrome
Firefox
Edge
Opera
Safari
background-attachment: wartość1
2008-12-11		1
2004-11-09		12
2015-07-29		3.5
1998-11-18		1
2003-06-23
background-attachment: fixed1
2008-12-11		2
2006-10-24		12
2015-07-29		10.5
2010-03-02		15.4
2022-03-14
background-attachment: local1
2008-12-11		25
2013-10-29		12
2015-07-29		10.5
2010-03-02		15.4
2022-03-14
background-attachment: scroll1
2008-12-11		1
2004-11-09		12
2015-07-29		15
2013-07-02		1
2003-06-23
background-attachment: wartość /* multiple backgrounds */1
2008-12-11		3.6
2010-01-21		12
2015-07-29		10.5
2010-03-02		1.3
2005-04-15

Przycinanie tła {background-clip}

W jaki sposób usunąć tło spod wewnętrznych marginesów elementu, ale wyświetlić je pod treścią?


Chrome
Firefox
Edge
Opera
Safari
background-clip: wartość1
2008-12-11		4
2011-03-22		12
2015-07-29		10.5
2010-03-02		5
2010-06-07
background-clip: border-box1
2008-12-11		4
2011-03-22		12
2015-07-29		15
2013-07-02		3
2007-10-26
background-clip: content-box1
2008-12-11		4
2011-03-22		12
2015-07-29		10.5
2010-03-02		3
2007-10-26
background-clip: padding-box1
2008-12-11		4
2011-03-22		12
2015-07-29		15
2013-07-02		3
2007-10-26

Pozycja początkowa tła obrazkowego {background-origin}

W jaki sposób określić pozycję obrazka tła, względem której będą liczone wszelkie przesunięcia?


Chrome
Firefox
Edge
Opera
Safari
background-origin: wartość1
2008-12-11		4
2011-03-22		12
2015-07-29		10.5
2010-03-02		3
2007-10-26
background-origin: border-box1
2008-12-11		4
2011-03-22		12
2015-07-29		15
2013-07-02		3
2007-10-26
background-origin: content-box1
2008-12-11		4
2011-03-22		12
2015-07-29		10.5
2010-03-02		3
2007-10-26
background-origin: padding-box1
2008-12-11		4
2011-03-22		12
2015-07-29		15
2013-07-02		3
2007-10-26

Rozmiary tła obrazkowego {background-size}

W jaki sposób przeskalować obrazek wstawiony w tle, tak żeby pasował idealnie?


Chrome
Firefox
Edge
Opera
Safari
background-size: wartość3
2009-09-15		4
2011-03-22		12
2015-07-29		10
2009-09-01		5
2010-06-07
background-size: auto1
2008-12-11		3.6
2010-01-21		12
2015-07-29		15
2013-07-02		3
2007-10-26
background-size: contain3
2009-09-15		3.6
2010-01-21		12
2015-07-29		10
2009-09-01		5
2010-06-07
background-size: cover3
2009-09-15		3.6
2010-01-21		12
2015-07-29		10
2009-09-01		5
2010-06-07

Atrybuty mieszane tła {background}

Jak można najłatwiej ustawić kilka własności tła w jednym poleceniu?


Chrome
Firefox
Edge
Opera
Safari
background: wartość1
2008-12-11		1
2004-11-09		12
2015-07-29		3.5
1998-11-18		1
2003-06-23
background: background-clip21
2012-07-31		22
2013-06-25		12
2015-07-29		15
2013-07-02		5.1
2011-07-20
background: background-origin21
2012-07-31		22
2013-06-25		12
2015-07-29		15
2013-07-02		5.1
2011-07-20
background: background-size21
2012-07-31		9
2011-12-20		12
2015-07-29		21
2014-05-06		5.1
2011-07-20
background: wartość /* multiple backgrounds */1
2008-12-11		3.6
2010-01-21		12
2015-07-29		10.5
2010-03-02		1.3
2005-04-15

Gradient liniowy {background: linear-gradient repeating-linear-gradient}

Jak wypełnić tło płynnym przejściem kilku kolorów w postaci gradientu?


Chrome
Firefox
Edge
Opera
Safari
linear-gradient26
2013-03-26		16
2012-10-09		12
2015-07-29		12.1
2012-11-20		7
2013-10-22
linear-gradient26
2013-03-26		10
2012-01-31		12
2015-07-29		12.1
2012-11-20		7
2013-10-22
repeating-linear-gradient26
2013-03-26		16
2012-10-09		12
2015-07-29		12.1
2012-11-20		7
2013-10-22
repeating-linear-gradient26
2013-03-26		10
2012-01-31		12
2015-07-29		12.1
2012-11-20		7
2013-10-22

Gradient promienisty {background: radial-gradient repeating-radial-gradient}

Jak wypełnić tło płynnym przejściem kilku kolorów, wywołując efekt trójwymiarowej kuli lub oświetlenia latarki?


Chrome
Firefox
Edge
Opera
Safari
radial-gradient26
2013-03-26		16
2012-10-09		12
2015-07-29		12.1
2012-11-20		7
2013-10-22
radial-gradient26
2013-03-26		10
2012-01-31		12
2015-07-29		11.6
2011-12-06		7
2013-10-22
repeating-radial-gradient26
2013-03-26		16
2012-10-09		12
2015-07-29		12.1
2012-11-20		7
2013-10-22
repeating-radial-gradient26
2013-03-26		16
2012-10-09		12
2015-07-29		15
2013-07-02		7
2013-10-22

Marginesy CSS

Wymiarowanie pudełka {box-sizing}

Jak zmienić zasady obliczania faktycznych rozmiarów elementów na stronach WWW?


Chrome
Firefox
Edge
Opera
Safari
box-sizing: wartość10
2011-03-08		29
2014-04-29		12
2015-07-29		7
2003-01-28		5.1
2011-07-20
box-sizing: border-box1
2008-12-11		1
2004-11-09		12
2015-07-29		15
2013-07-02		3
2007-10-26
box-sizing: content-box1
2008-12-11		1
2004-11-09		12
2015-07-29		15
2013-07-02		3
2007-10-26

Górny margines {margin-top}

Jak ustawić górny margines dowolnego elementu?


Chrome
Firefox
Edge
Opera
Safari
margin-top: wartość1
2008-12-11		1
2004-11-09		12
2015-07-29		3.5
1998-11-18		1
2003-06-23
margin-top: auto1
2008-12-11		1
2004-11-09		12
2015-07-29		3.5
1998-11-18		1
2003-06-23

Dolny margines {margin-bottom}

Jak ustawić dolny margines dowolnego elementu?


Chrome
Firefox
Edge
Opera
Safari
margin-bottom: wartość1
2008-12-11		1
2004-11-09		12
2015-07-29		3.5
1998-11-18		1
2003-06-23
margin-bottom: auto1
2008-12-11		1
2004-11-09		12
2015-07-29		3.5
1998-11-18		1
2003-06-23

Lewy margines {margin-left}

Jak ustawić lewy margines dowolnego elementu?


Chrome
Firefox
Edge
Opera
Safari
margin-left: wartość1
2008-12-11		1
2004-11-09		12
2015-07-29		3.5
1998-11-18		1
2003-06-23
margin-left: auto1
2008-12-11		1
2004-11-09		12
2015-07-29		3.5
1998-11-18		1
2003-06-23

Prawy margines {margin-right}

Jak ustawić prawy margines dowolnego elementu?


Chrome
Firefox
Edge
Opera
Safari
margin-right: wartość1
2008-12-11		1
2004-11-09		12
2015-07-29		3.5
1998-11-18		1
2003-06-23
margin-right: auto1
2008-12-11		1
2004-11-09		12
2015-07-29		3.5
1998-11-18		1
2003-06-23

Atrybuty mieszane marginesu {margin}

Jak ustawić jednocześnie wszystkie marginesy dla dowolnego elementu: górny, prawy, dolny, lewy?


Chrome
Firefox
Edge
Opera
Safari
margin: wartość1
2008-12-11		1
2004-11-09		12
2015-07-29		3.5
1998-11-18		1
2003-06-23
margin: auto1
2008-12-11		1
2004-11-09		12
2015-07-29		3.5
1998-11-18		1
2003-06-23

Górny margines wewnętrzny {padding-top}

Jak dodać górny margines (odstęp) wewnątrz dowolnego elementu?


Chrome
Firefox
Edge
Opera
Safari
padding-top: wartość1
2008-12-11		1
2004-11-09		12
2015-07-29		3.5
1998-11-18		1
2003-06-23

Dolny margines wewnętrzny {padding-bottom}

Jak dodać dolny margines (odstęp) wewnątrz dowolnego elementu?


Chrome
Firefox
Edge
Opera
Safari
padding-bottom: wartość1
2008-12-11		1
2004-11-09		12
2015-07-29		3.5
1998-11-18		1
2003-06-23

Lewy margines wewnętrzny {padding-left}

Jak dodać lewy margines (odstęp) wewnątrz dowolnego elementu?


Chrome
Firefox
Edge
Opera
Safari
padding-left: wartość1
2008-12-11		1
2004-11-09		12
2015-07-29		3.5
1998-11-18		1
2003-06-23

Prawy margines wewnętrzny {padding-right}

Jak dodać prawy margines (odstęp) wewnątrz dowolnego elementu?


Chrome
Firefox
Edge
Opera
Safari
padding-right: wartość1
2008-12-11		1
2004-11-09		12
2015-07-29		3.5
1998-11-18		1
2003-06-23

Atrybuty mieszane marginesu wewnętrznego {padding}

Jak ustawić jednocześnie wszystkie marginesy wewnątrz dowolnego elementu (odstępy): górny, prawy, dolny, lewy?


Chrome
Firefox
Edge
Opera
Safari
padding: wartość1
2008-12-11		1
2004-11-09		12
2015-07-29		3.5
1998-11-18		1
2003-06-23

Obramowanie CSS

Styl obramowania {border-...-style}

Jak dodać obramowanie do dowolnego elementu: linia przerywana (kreskowa i kropkowa), linia ciągła, podwójne obramowanie, rowek, grzbiet, ramka, przycisk?


Chrome
Firefox
Edge
Opera
Safari
border-top-style: wartość1
2008-12-11		1
2004-11-09		12
2015-07-29		9.2
2007-04-11		1
2003-06-23
border-right-style: wartość1
2008-12-11		1
2004-11-09		12
2015-07-29		9.2
2007-04-11		1
2003-06-23
border-bottom-style: wartość1
2008-12-11		1
2004-11-09		12
2015-07-29		9.2
2007-04-11		1
2003-06-23
border-left-style: wartość1
2008-12-11		1
2004-11-09		12
2015-07-29		9.2
2007-04-11		1
2003-06-23

Atrybuty mieszane stylu obramowania {border-style}

Jak ustawić styl obramowania dla wszystkich krawędzi jednocześnie?


Chrome
Firefox
Edge
Opera
Safari
border-style: wartość1
2008-12-11		1
2004-11-09		12
2015-07-29		3.5
1998-11-18		1
2003-06-23
border-style: dashed1
2008-12-11		1
2004-11-09		12
2015-07-29		15
2013-07-02		1
2003-06-23
border-style: double1
2008-12-11		1
2004-11-09		12
2015-07-29		15
2013-07-02		1
2003-06-23
border-style: groove1
2008-12-11		1
2004-11-09		12
2015-07-29		15
2013-07-02		1
2003-06-23
border-style: inset1
2008-12-11		1
2004-11-09		12
2015-07-29		15
2013-07-02		1
2003-06-23
border-style: outset1
2008-12-11		1
2004-11-09		12
2015-07-29		15
2013-07-02		1
2003-06-23
border-style: ridge1
2008-12-11		1
2004-11-09		12
2015-07-29		15
2013-07-02		1
2003-06-23
border-style: solid1
2008-12-11		1
2004-11-09		12
2015-07-29		15
2013-07-02		1
2003-06-23

Szerokość obramowania {border-...-width}

Jak ustawić szerokość (grubość) obramowania dowolnego elementu?


Chrome
Firefox
Edge
Opera
Safari
border-top-width: wartość1
2008-12-11		1
2004-11-09		12
2015-07-29		3.5
1998-11-18		1
2003-06-23
border-right-width: wartość1
2008-12-11		1
2004-11-09		12
2015-07-29		3.5
1998-11-18		1
2003-06-23
border-bottom-width: wartość1
2008-12-11		1
2004-11-09		12
2015-07-29		3.5
1998-11-18		1
2003-06-23
border-left-width: wartość1
2008-12-11		1
2004-11-09		12
2015-07-29		3.5
1998-11-18		1
2003-06-23

Atrybuty mieszane szerokości obramowania {border-width}

Jak ustawić szerokość (grubość) obramowania dla wszystkich krawędzi jednocześnie?


Chrome
Firefox
Edge
Opera
Safari
border-width: wartość1
2008-12-11		1
2004-11-09		12
2015-07-29		3.5
1998-11-18		1
2003-06-23

Kolor obramowania {border-...-color}

Jak ustawić kolor obramowania dowolnego elementu?


Chrome
Firefox
Edge
Opera
Safari
border-top-color: wartość1
2008-12-11		1
2004-11-09		12
2015-07-29		3.5
1998-11-18		1
2003-06-23
border-right-color: wartość1
2008-12-11		1
2004-11-09		12
2015-07-29		3.5
1998-11-18		1
2003-06-23
border-bottom-color: wartość1
2008-12-11		1
2004-11-09		12
2015-07-29		3.5
1998-11-18		1
2003-06-23
border-left-color: wartość1
2008-12-11		1
2004-11-09		12
2015-07-29		3.5
1998-11-18		1
2003-06-23

Atrybuty mieszane koloru obramowania {border-color}

Jak ustawić kolor obramowania dla wszystkich krawędzi jednocześnie?


Chrome
Firefox
Edge
Opera
Safari
border-color: wartość1
2008-12-11		1
2004-11-09		12
2015-07-29		3.5
1998-11-18		1
2003-06-23

Atrybuty mieszane obramowania {border}

Jak ustawić szerokość (grubość), styl i kolor obramowania dowolnego elementu?


Chrome
Firefox
Edge
Opera
Safari
border: wartość1
2008-12-11		1
2004-11-09		12
2015-07-29		3.5
1998-11-18		1
2003-06-23
border-top: wartość1
2008-12-11		1
2004-11-09		12
2015-07-29		3.5
1998-11-18		1
2003-06-23
border-right: wartość1
2008-12-11		1
2004-11-09		12
2015-07-29		9.2
2007-04-11		1
2003-06-23
border-bottom: wartość1
2008-12-11		1
2004-11-09		12
2015-07-29		3.5
1998-11-18		1
2003-06-23
border-left: wartość1
2008-12-11		1
2004-11-09		12
2015-07-29		3.5
1998-11-18		1
2003-06-23

Styl obrysu {outline-style}

Co to jest obrys i czym się różni od obramowania?


Chrome
Firefox
Edge
Opera
Safari
outline-style: wartość1
2008-12-11		1.5
2005-11-29		12
2015-07-29		7
2003-01-28		1.2
2004-02-02
outline-style: dashed1
2008-12-11		1
2004-11-09		12
2015-07-29		15
2013-07-02		1.2
2004-02-02
outline-style: dotted1
2008-12-11		1
2004-11-09		12
2015-07-29		15
2013-07-02		1.2
2004-02-02
outline-style: double1
2008-12-11		1
2004-11-09		12
2015-07-29		15
2013-07-02		1.2
2004-02-02
outline-style: groove1
2008-12-11		1
2004-11-09		12
2015-07-29		15
2013-07-02		1.2
2004-02-02
outline-style: inset1
2008-12-11		1
2004-11-09		12
2015-07-29		15
2013-07-02		1.2
2004-02-02
outline-style: none1
2008-12-11		1
2004-11-09		12
2015-07-29		15
2013-07-02		1.2
2004-02-02
outline-style: outset1
2008-12-11		1
2004-11-09		12
2015-07-29		15
2013-07-02		1.2
2004-02-02
outline-style: ridge1
2008-12-11		1
2004-11-09		12
2015-07-29		15
2013-07-02		1.2
2004-02-02
outline-style: solid1
2008-12-11		1
2004-11-09		12
2015-07-29		15
2013-07-02		1.2
2004-02-02

Szerokość obrysu {outline-width}

W jaki sposób ustawić szerokość (grubość) obrysu dowolnego elementu?


Chrome
Firefox
Edge
Opera
Safari
outline-width: wartość1
2008-12-11		1.5
2005-11-29		12
2015-07-29		7
2003-01-28		1.2
2004-02-02

Kolor obrysu {outline-color}

W jaki sposób ustawić kolor obrysu dowolnego elementu?


Chrome
Firefox
Edge
Opera
Safari
outline-color: wartość1
2008-12-11		1.5
2005-11-29		12
2015-07-29		7
2003-01-28		1.2
2004-02-02

Atrybuty mieszane obrysu {outline}

Jak ustawić szerokość (grubość), styl i kolor obrysu dowolnego elementu?


Chrome
Firefox
Edge
Opera
Safari
outline: wartość94
2021-09-21		88
2021-04-19		94
2021-09-24		80
2021-10-05		16.4
2023-03-27

Odstęp obrysu {outline-offset}

W jaki sposób odsunąć ramkę obrysu od krawędzi elementu?


Chrome
Firefox
Edge
Opera
Safari
outline-offset: wartość1
2008-12-11		1.5
2005-11-29		15
2017-04-05		9.5
2008-06-12		1.2
2004-02-02

Zaokrąglenie obramowania {border-...-radius}

W jaki sposób wstawić na stronę element z zaokrąglonymi narożnikami?


Chrome
Firefox
Edge
Opera
Safari
border-top-left-radius: wartość4
2010-01-25		4
2011-03-22		12
2015-07-29		10.5
2010-03-02		5
2010-06-07
border-top-right-radius: wartość4
2010-01-25		4
2011-03-22		12
2015-07-29		10.5
2010-03-02		5
2010-06-07
border-bottom-right-radius: wartość4
2010-01-25		4
2011-03-22		12
2015-07-29		10.5
2010-03-02		5
2010-06-07
border-bottom-left-radius: wartość4
2010-01-25		4
2011-03-22		12
2015-07-29		10.5
2010-03-02		5
2010-06-07

Atrybuty mieszane zaokrąglenia obramowania {border-radius}

Jak ustawić zaokrąglenia dla wszystkich narożników jednocześnie?


Chrome
Firefox
Edge
Opera
Safari
border-radius: wartość4
2010-01-25		4
2011-03-22		12
2015-07-29		10.5
2010-03-02		5
2010-06-07

Dekoracja przełamania obramowania {box-decoration-break}

W jaki sposób pozbyć się nieestetycznego efektu zanikania obramowania podczas przełamania strony lub linii?

❌ Nie działa

Chrome
Firefox
Edge
Opera
Safari
box-decoration-break: wartość130
2024-10-15		32
2014-09-02		130
2024-10-17		115
2024-11-27		❌
box-decoration-break: clone130
2024-10-15		32
2014-09-02		130
2024-10-17		115
2024-11-27		7
2013-10-22
box-decoration-break: slice130
2024-10-15		32
2014-09-02		130
2024-10-17		115
2024-11-27		7
2013-10-22

Cień {box-shadow}

W jaki sposób podstawić efektownie wyglądający cień pod elementem?


Chrome
Firefox
Edge
Opera
Safari
box-shadow: wartość10
2011-03-08		4
2011-03-22		12
2015-07-29		10.5
2010-03-02		5.1
2011-07-20
box-shadow: inset1
2008-12-11		3.5
2009-06-30		12
2015-07-29		10.5
2010-03-02		5
2010-06-07

Obramowanie obrazkowe {border-image-source}

Jak udekorować ramkę na stronie obramowaniem graficznym?


Chrome
Firefox
Edge
Opera
Safari
border-image-source: wartość15
2011-10-25		15
2012-08-28		12
2015-07-29		15
2013-07-02		6
2012-07-25

Obcięcie obramowania obrazkowego {border-image-slice}

Jak podzielić obramowanie graficzne na narożniki, krawędzie i środek?


Chrome
Firefox
Edge
Opera
Safari
border-image-slice: wartość15
2011-10-25		15
2012-08-28		12
2015-07-29		15
2013-07-02		6
2012-07-25

Szerokość obramowania obrazkowego {border-image-width}

W jaki sposób podać szerokość (grubość) obramowania obrazkowego?


Chrome
Firefox
Edge
Opera
Safari
border-image-width: wartość16
2011-12-13		13
2012-06-05		12
2015-07-29		15
2013-07-02		6
2012-07-25
border-image-width: auto16
2011-12-13		15
2012-08-28		12
2015-07-29		15
2013-07-02		6
2012-07-25

Nawis obramowania obrazkowego {border-image-outset}

Jak wysunąć obramowanie obrazkowe poza krawędzie elementu?


Chrome
Firefox
Edge
Opera
Safari
border-image-outset: wartość15
2011-10-25		15
2012-08-28		12
2015-07-29		15
2013-07-02		6
2012-07-25

Powtarzanie obramowania obrazkowego {border-image-repeat}

W jaki sposób powielić obrazek w postaci obramowania elementu?


Chrome
Firefox
Edge
Opera
Safari
border-image-repeat: wartość15
2011-10-25		15
2012-08-28		12
2015-07-29		15
2013-07-02		6
2012-07-25
border-image-repeat: repeat15
2011-10-25		15
2012-08-28		12
2015-07-29		15
2013-07-02		6
2012-07-25
border-image-repeat: round30
2013-10-01		15
2012-08-28		12
2015-07-29		17
2013-10-08		9.1
2016-03-21
border-image-repeat: space56
2017-01-25		50
2016-11-15		12
2015-07-29		43
2017-02-07		9.1
2016-03-21
border-image-repeat: stretch15
2011-10-25		15
2012-08-28		12
2015-07-29		15
2013-07-02		6
2012-07-25

Atrybuty mieszane obramowania obrazkowego {border-image}

Jak ustawić obrazek obramowania, jego narożniki, krawędzie, środek, a także jego szerokość (grubość) i powtarzanie (powielanie)?


Chrome
Firefox
Edge
Opera
Safari
border-image: wartość16
2011-12-13		15
2012-08-28		12
2015-07-29		11
2010-12-16		6
2012-07-25

Wykazy CSS

Typ stylu wykazu {list-style-type}

Jak zmienić rodzaj (styl, typ) wykazu - wypunktowanie (koło, okrąg, kwadrat) i numerowanie (liczby arabskie, rzymskie, litery łacińskie, greckie, hebrajskie)?


Chrome
Firefox
Edge
Opera
Safari
list-style-type: wartość1
2008-12-11		1
2004-11-09		12
2015-07-29		3.5
1998-11-18		1
2003-06-23
list-style-type: armenian1
2008-12-11		1
2004-11-09		12
2015-07-29		6
2001-12-18		1
2003-06-23
list-style-type: circle1
2008-12-11		1
2004-11-09		12
2015-07-29		3.5
1998-11-18		1
2003-06-23
list-style-type: cjk-ideographic1
2008-12-11		1
2004-11-09		79
2020-01-15		15
2013-07-02		5
2010-06-07
list-style-type: decimal1
2008-12-11		1
2004-11-09		12
2015-07-29		3.5
1998-11-18		1
2003-06-23
list-style-type: decimal-leading-zero1
2008-12-11		1
2004-11-09		12
2015-07-29		8
2005-04-19		1
2003-06-23
list-style-type: disc1
2008-12-11		1
2004-11-09		12
2015-07-29		3.5
1998-11-18		1
2003-06-23
list-style-type: georgian1
2008-12-11		1
2004-11-09		12
2015-07-29		6
2001-12-18		1
2003-06-23
list-style-type: hebrew1
2008-12-11		1
2004-11-09		12
2015-07-29		15
2013-07-02		1
2003-06-23
list-style-type: hiragana1
2008-12-11		1
2004-11-09		12
2015-07-29		15
2013-07-02		1
2003-06-23
list-style-type: hiragana-iroha1
2008-12-11		1
2004-11-09		12
2015-07-29		15
2013-07-02		1
2003-06-23
list-style-type: katakana1
2008-12-11		1
2004-11-09		12
2015-07-29		15
2013-07-02		1
2003-06-23
list-style-type: katakana-iroha1
2008-12-11		1
2004-11-09		12
2015-07-29		15
2013-07-02		1
2003-06-23
list-style-type: lower-alpha1
2008-12-11		1
2004-11-09		12
2015-07-29		6
2001-12-18		1
2003-06-23
list-style-type: lower-greek1
2008-12-11		1
2004-11-09		12
2015-07-29		6
2001-12-18		1
2003-06-23
list-style-type: lower-latin1
2008-12-11		1
2004-11-09		12
2015-07-29		6
2001-12-18		1
2003-06-23
list-style-type: lower-roman1
2008-12-11		1
2004-11-09		12
2015-07-29		6
2001-12-18		1
2003-06-23
list-style-type: none1
2008-12-11		1
2004-11-09		12
2015-07-29		15
2013-07-02		1
2003-06-23
list-style-type: square1
2008-12-11		1
2004-11-09		12
2015-07-29		3.5
1998-11-18		1
2003-06-23
list-style-type: upper-alpha1
2008-12-11		1
2004-11-09		12
2015-07-29		6
2001-12-18		1
2003-06-23
list-style-type: upper-latin1
2008-12-11		1
2004-11-09		12
2015-07-29		6
2001-12-18		1
2003-06-23
list-style-type: upper-roman1
2008-12-11		1
2004-11-09		12
2015-07-29		6
2001-12-18		1
2003-06-23

Niestandardowy typ stylu wykazu @counter-style

W jaki sposób stworzyć własny, niestandardowy rodzaj (typ, styl) wykazu? Jak zrobić listę z punktami w postaci emotikon (emoji)?

❌ Nie działa   🔷 Zawiera błędy

Chrome
Firefox
Edge
Opera
Safari
@counter-style91
2021-05-25		33
2014-10-14		91
2021-05-27		77
2021-06-09		17
2023-09-18
@counter-style { additive-symbols: wartość }91
2021-05-25		33
2014-10-14		91
2021-05-27		77
2021-06-09		17
2023-09-18
@counter-style { fallback: wartość }91
2021-05-25		33
2014-10-14		91
2021-05-27		77
2021-06-09		17
2023-09-18
@counter-style { negative: wartość }91
2021-05-25		33
2014-10-14		91
2021-05-27		77
2021-06-09		17
2023-09-18
@counter-style { pad: wartość }91
2021-05-25		33
2014-10-14		91
2021-05-27		77
2021-06-09		17
2023-09-18
@counter-style { prefix: wartość }91
2021-05-25		33
2014-10-14		91
2021-05-27		77
2021-06-09		17
2023-09-18
@counter-style { range: wartość }91
2021-05-25		33
2014-10-14		91
2021-05-27		77
2021-06-09		17
2023-09-18
@counter-style { suffix: wartość }91
2021-05-25		33
2014-10-14		91
2021-05-27		77
2021-06-09		17
2023-09-18
@counter-style { symbols: wartość }🔷 91
2021-05-25		🔷 33
2014-10-14		🔷 91
2021-05-27		🔷 77
2021-06-09		17
2023-09-18
@counter-style { system: wartość }91
2021-05-25		33
2014-10-14		91
2021-05-27		77
2021-06-09		17
2023-09-18
list-style-type: symbols❌35
2015-01-13		❌❌❌

Zawijanie tekstu w wykazie {list-style-position}

Co zrobić, aby punkt wykazu (wyróżnik, marker) znajdował się wewnątrz tekstu?


Chrome
Firefox
Edge
Opera
Safari
list-style-position: wartość1
2008-12-11		1
2004-11-09		12
2015-07-29		3.5
1998-11-18		1
2003-06-23
list-style-position: inside1
2008-12-11		1
2004-11-09		12
2015-07-29		15
2013-07-02		1
2003-06-23
list-style-position: outside1
2008-12-11		1
2004-11-09		12
2015-07-29		15
2013-07-02		1
2003-06-23

Wyróżnik obrazkowy wykazu {list-style-image}

Jak wstawić grafikę (obrazek) jak punkt wykazu (wyróżnik, marker)?


Chrome
Firefox
Edge
Opera
Safari
list-style-image: wartość1
2008-12-11		1
2004-11-09		12
2015-07-29		7
2003-01-28		1
2003-06-23
list-style-image: none1
2008-12-11		1
2004-11-09		12
2015-07-29		15
2013-07-02		1
2003-06-23

Atrybuty mieszane wykazu {list-style}

Jak ustalić kilka własności wyglądu wykazu w jednym poleceniu?


Chrome
Firefox
Edge
Opera
Safari
list-style: wartość1
2008-12-11		1
2004-11-09		12
2015-07-29		7
2003-01-28		1
2003-06-23

Automatyczna numeracja wykazu {counter-reset, counter-increment}

W jaki sposób stworzyć automatyczną numerację punktów i podpunktów w stylu: 1, 1.1, 1.1.1 itd.?


Chrome
Firefox
Edge
Opera
Safari
counter-increment: wartość2
2009-05-21		1
2004-11-09		12
2015-07-29		9.2
2007-04-11		3
2007-10-26
counter-increment: none2
2009-05-21		1
2004-11-09		12
2015-07-29		15
2013-07-02		3
2007-10-26
counter-reset: wartość2
2009-05-21		1
2004-11-09		12
2015-07-29		9.2
2007-04-11		3
2007-10-26
counter-reset: none2
2009-05-21		1
2004-11-09		12
2015-07-29		15
2013-07-02		3
2007-10-26

Rozmiary CSS

Szerokość {width}

W jaki sposób najprościej ustawić szerokość elementu?


Chrome
Firefox
Edge
Opera
Safari
width: wartość1
2008-12-11		1
2004-11-09		12
2015-07-29		3.5
1998-11-18		1
2003-06-23

Wysokość {height}

W jaki sposób najprościej ustawić wysokość elementu?


Chrome
Firefox
Edge
Opera
Safari
height: wartość1
2008-12-11		1
2004-11-09		12
2015-07-29		7
2003-01-28		1
2003-06-23

Maksymalna szerokość {max-width}

Co zrobić, aby szerokość elementu nigdy nie przekroczyła ustalonej wartości?


Chrome
Firefox
Edge
Opera
Safari
max-width: wartość1
2008-12-11		1
2004-11-09		12
2015-07-29		4
2000-06-28		1
2003-06-23

Minimalna szerokość {min-width}

Co zrobić, aby szerokość elementu nigdy nie była mniejsza od ustalonej wartości?


Chrome
Firefox
Edge
Opera
Safari
min-width: wartość1
2008-12-11		1
2004-11-09		12
2015-07-29		4
2000-06-28		1
2003-06-23

Maksymalna wysokość {max-height}

Co zrobić, aby wysokość elementu nigdy nie przekroczyła ustalonej wartości?


Chrome
Firefox
Edge
Opera
Safari
max-height: wartość1
2008-12-11		1
2004-11-09		12
2015-07-29		7
2003-01-28		1.3
2005-04-15

Minimalna wysokość {min-height}

Co zrobić, aby wysokość elementu nigdy nie była mniejsza od ustalonej wartości?


Chrome
Firefox
Edge
Opera
Safari
min-height: wartość1
2008-12-11		3
2008-06-17		12
2015-07-29		4
2000-06-28		1.3
2005-04-15

Przepełnienie {overflow}

W jaki sposób dodać suwaki przewijania do dowolnego elementu? Co zrobić, aby zawartość elementu nigdy nie wychodziła poza jego obręb?


Chrome
Firefox
Edge
Opera
Safari
overflow: wartość1
2008-12-11		1
2004-11-09		12
2015-07-29		7
2003-01-28		1
2003-06-23
overflow: auto1
2008-12-11		1
2004-11-09		12
2015-07-29		15
2013-07-02		3
2007-10-26
overflow: hidden1
2008-12-11		1
2004-11-09		12
2015-07-29		15
2013-07-02		3
2007-10-26
overflow: scroll1
2008-12-11		1
2004-11-09		12
2015-07-29		15
2013-07-02		3
2007-10-26
overflow: visible1
2008-12-11		1
2004-11-09		12
2015-07-29		15
2013-07-02		3
2007-10-26

Przepełnienie tekstu {text-overflow}

Co zrobić, kiedy tekst nie mieści się w ustalonej szerokości elementu na stronie?


Chrome
Firefox
Edge
Opera
Safari
text-overflow: wartość1
2008-12-11		7
2011-09-27		12
2015-07-29		11
2010-12-16		1.3
2005-04-15
text-overflow: clip1
2008-12-11		7
2011-09-27		12
2015-07-29		15
2013-07-02		1.3
2005-04-15
text-overflow: ellipsis1
2008-12-11		7
2011-09-27		12
2015-07-29		15
2013-07-02		1.3
2005-04-15

Przeciąganie {resize}

W jaki sposób zablokować możliwość zmiany rozmiaru (przeciągania) obszaru tekstowego w formularzu?


Chrome
Firefox
Edge
Opera
Safari
resize: wartość1
2008-12-11		4
2011-03-22		79
2020-01-15		12.1
2012-11-20		3
2007-10-26

Tabele CSS

Podpis tabeli {caption-side}

W jaki sposób ustalić położenie podpisu (tytułu) tabeli?

❌ Nie działa

Chrome
Firefox
Edge
Opera
Safari
caption-side: wartość1
2008-12-11		1
2004-11-09		12
2015-07-29		4
2000-06-28		1
2003-06-23
caption-side: bottom1
2008-12-11		1
2004-11-09		79
2020-01-15		15
2013-07-02		1
2003-06-23
caption-side: left❌❌❌❌❌
caption-side: right❌❌❌❌❌
caption-side: top1
2008-12-11		1
2004-11-09		79
2020-01-15		15
2013-07-02		1
2003-06-23

Rozplanowanie tabeli {table-layout}

W jaki sposób przeglądarka oblicza rozmiary poszczególnych komórek tabeli? W jaki sposób wyświetlić tabelę bardzo wydajnym algorytmem?


Chrome
Firefox
Edge
Opera
Safari
table-layout: wartość14
2011-09-16		1
2004-11-09		12
2015-07-29		7
2003-01-28		1
2003-06-23
table-layout: auto14
2011-09-16		1
2004-11-09		12
2015-07-29		7
2003-01-28		1
2003-06-23
table-layout: fixed14
2011-09-16		1
2004-11-09		12
2015-07-29		7
2003-01-28		1
2003-06-23

Obramowanie tabeli {border-collapse, border}

Jak dodać efektowne obramowanie tabeli i jej komórek? Jak wprowadzić nowy, estetyczny model obramowania w tabeli za pomocą pojedynczych linii?


Chrome
Firefox
Edge
Opera
Safari
border-collapse: wartość1
2008-12-11		1
2004-11-09		12
2015-07-29		4
2000-06-28		1.1
2003-10-24
border-collapse: collapse1
2008-12-11		1
2004-11-09		79
2020-01-15		15
2013-07-02		1.1
2003-10-24
border-collapse: separate1
2008-12-11		1
2004-11-09		79
2020-01-15		15
2013-07-02		1.1
2003-10-24

Odstępy między komórkami tabeli {border-spacing}

Jak zmienić odstępy pomiędzy sąsiednimi komórkami tabeli? Jak ustawić pionowy odstęp inny niż poziomy?


Chrome
Firefox
Edge
Opera
Safari
border-spacing: wartość1
2008-12-11		1
2004-11-09		12
2015-07-29		4
2000-06-28		1
2003-06-23

Puste komórki tabeli {empty-cells}

Co zrobić, aby wokół pustych komórek tabeli wyświetlało się obramowanie?


Chrome
Firefox
Edge
Opera
Safari
empty-cells: wartość1
2008-12-11		1
2004-11-09		12
2015-07-29		4
2000-06-28		1.2
2004-02-02
empty-cells: hide1
2008-12-11		1
2004-11-09		12
2015-07-29		4
2000-06-28		1.2
2004-02-02
empty-cells: show1
2008-12-11		1
2004-11-09		12
2015-07-29		4
2000-06-28		1.2
2004-02-02

Pozycjonowanie CSS

Pozycja relatywna {position: relative}

W jaki sposób przesunąć dowolny element strony o podaną odległość?


Chrome
Firefox
Edge
Opera
Safari
position: relative1
2008-12-11		1
2004-11-09		12
2015-07-29		15
2013-07-02		1
2003-06-23

Pozycja absolutna {position: absolute}

W jaki sposób ustawić dowolny element strony w żądanym miejscu na ekranie?


Chrome
Firefox
Edge
Opera
Safari
position: absolute1
2008-12-11		1
2004-11-09		12
2015-07-29		15
2013-07-02		1
2003-06-23

Pozycja ustalona {position: fixed}

Jak ustawić element, aby nie przesuwał się podczas przewijania strony?


Chrome
Firefox
Edge
Opera
Safari
position: fixed1
2008-12-11		1
2004-11-09		12
2015-07-29		4
2000-06-28		1
2003-06-23

Pozycja statyczna {position: static}

Jak przywrócić domyślny sposób ustawienia elementu wypozycjonowanego?


Chrome
Firefox
Edge
Opera
Safari
position: static1
2008-12-11		1
2004-11-09		12
2015-07-29		15
2013-07-02		1
2003-06-23

Przezroczystość {opacity}

W jaki sposób wstawić na stronie półprzezroczyste warstwy?


Chrome
Firefox
Edge
Opera
Safari
opacity: wartość1
2008-12-11		1
2004-11-09		12
2015-07-29		9
2006-06-20		2
2005-04-29

Nakładanie {z-index}

W jaki sposób ustawić elementy jeden na drugim? Jak ustawić element za tekstem?


Chrome
Firefox
Edge
Opera
Safari
z-index: wartość1
2008-12-11		1
2004-11-09		12
2015-07-29		4
2000-06-28		1
2003-06-23
z-index: auto1
2008-12-11		1
2004-11-09		12
2015-07-29		15
2013-07-02		1
2003-06-23

Obcinanie {clip}

W jaki sposób automatycznie przyciąć do określonych rozmiarów obrazek (grafikę, zdjęcie) lub inny element strony (kadrowanie)?


Chrome
Firefox
Edge
Opera
Safari
clip: wartość1
2008-12-11		1
2004-11-09		12
2015-07-29		7
2003-01-28		1
2003-06-23
clip: auto1
2008-12-11		1
2004-11-09		79
2020-01-15		15
2013-07-02		1
2003-06-23

Wyświetlanie {display}

Jak ukryć dowolny element strony? W jaki sposób zmienić domyśle wyświetlanie dowolnych elementów strony, tak aby stały się wykazem czy tabelką?


Chrome
Firefox
Edge
Opera
Safari
display: wartość1
2008-12-11		1
2004-11-09		12
2015-07-29		7
2003-01-28		1
2003-06-23
display: block1
2008-12-11		1
2004-11-09		12
2015-07-29		7
2003-01-28		1
2003-06-23
display: inline1
2008-12-11		1
2004-11-09		12
2015-07-29		7
2003-01-28		1
2003-06-23
display: inline-block1
2008-12-11		1
2004-11-09		12
2015-07-29		7
2003-01-28		1
2003-06-23
display: inline-table1
2008-12-11		3
2008-06-17		12
2015-07-29		7
2003-01-28		1
2003-06-23
display: list-item1
2008-12-11		1
2004-11-09		12
2015-07-29		7
2003-01-28		1
2003-06-23
display: none1
2008-12-11		1
2004-11-09		12
2015-07-29		7
2003-01-28		1
2003-06-23
display: table1
2008-12-11		1
2004-11-09		12
2015-07-29		7
2003-01-28		1
2003-06-23
display: table-caption1
2008-12-11		1
2004-11-09		≤15
2017-04-05		15
2013-07-02		≤4
2009-06-08
display: table-cell1
2008-12-11		1
2004-11-09		12
2015-07-29		7
2003-01-28		1
2003-06-23
display: table-column1
2008-12-11		1
2004-11-09		12
2015-07-29		7
2003-01-28		1
2003-06-23
display: table-column-group1
2008-12-11		1
2004-11-09		12
2015-07-29		7
2003-01-28		1
2003-06-23
display: table-footer-group1
2008-12-11		1
2004-11-09		12
2015-07-29		7
2003-01-28		1
2003-06-23
display: table-header-group1
2008-12-11		1
2004-11-09		12
2015-07-29		7
2003-01-28		1
2003-06-23
display: table-row1
2008-12-11		1
2004-11-09		12
2015-07-29		7
2003-01-28		1
2003-06-23
display: table-row-group1
2008-12-11		1
2004-11-09		12
2015-07-29		7
2003-01-28		1
2003-06-23

Widzialność {visibility}

W jaki sposób schować element, tak aby pozostało po nim puste miejsce?


Chrome
Firefox
Edge
Opera
Safari
visibility: wartość1
2008-12-11		1
2004-11-09		12
2015-07-29		4
2000-06-28		1
2003-06-23
visibility: collapse1
2008-12-11		1
2004-11-09		12
2015-07-29		4
2000-06-28		1.3
2005-04-15
visibility: hidden1
2008-12-11		1
2004-11-09		12
2015-07-29		15
2013-07-02		1
2003-06-23
visibility: visible1
2008-12-11		1
2004-11-09		12
2015-07-29		15
2013-07-02		1
2003-06-23

Ustawienie {float, vertical-align}

Jak ustawić obrazek (grafikę, zdjęcie) lub dowolny inny element po lewej bądź po prawej stronie tekstu? Jak ustawić element na górze, na środku lub na dole innego elementu? Jak stworzyć indeks górny i dolny za pomocą CSS?


Chrome
Firefox
Edge
Opera
Safari
float: wartość1
2008-12-11		1
2004-11-09		12
2015-07-29		7
2003-01-28		1
2003-06-23
float: left1
2008-12-11		1
2004-11-09		12
2015-07-29		15
2013-07-02		1
2003-06-23
float: none1
2008-12-11		1
2004-11-09		12
2015-07-29		15
2013-07-02		1
2003-06-23
float: right1
2008-12-11		1
2004-11-09		12
2015-07-29		15
2013-07-02		1
2003-06-23
vertical-align: wartość1
2008-12-11		1
2004-11-09		12
2015-07-29		4
2000-06-28		1
2003-06-23
vertical-align: baseline1
2008-12-11		1
2004-11-09		12
2015-07-29		15
2013-07-02		1
2003-06-23
vertical-align: bottom1
2008-12-11		1
2004-11-09		12
2015-07-29		15
2013-07-02		1
2003-06-23
vertical-align: middle1
2008-12-11		1
2004-11-09		12
2015-07-29		15
2013-07-02		1
2003-06-23
vertical-align: sub1
2008-12-11		1
2004-11-09		12
2015-07-29		15
2013-07-02		1
2003-06-23
vertical-align: super1
2008-12-11		1
2004-11-09		12
2015-07-29		15
2013-07-02		1
2003-06-23
vertical-align: text-bottom1
2008-12-11		1
2004-11-09		12
2015-07-29		15
2013-07-02		1
2003-06-23
vertical-align: text-top1
2008-12-11		1
2004-11-09		12
2015-07-29		15
2013-07-02		1
2003-06-23
vertical-align: top1
2008-12-11		1
2004-11-09		12
2015-07-29		15
2013-07-02		1
2003-06-23

Przyleganie {clear}

Jak zabezpieczyć się przed nieestetycznym przyleganiem dwóch elementów oblewanych tekstem (np. obrazki)? W jaki sposób nie dopuścić, aby obok tekstu znajdował się obrazek ani inny element?


Chrome
Firefox
Edge
Opera
Safari
clear: wartość1
2008-12-11		1
2004-11-09		12
2015-07-29		3.5
1998-11-18		1
2003-06-23
clear: both1
2008-12-11		1
2004-11-09		12
2015-07-29		15
2013-07-02		1
2003-06-23
clear: left1
2008-12-11		1
2004-11-09		12
2015-07-29		15
2013-07-02		1
2003-06-23
clear: right1
2008-12-11		1
2004-11-09		12
2015-07-29		15
2013-07-02		1
2003-06-23

Kursory CSS

Kształt kursora {cursor}

Jak zmienić kursor (wskaźnik) myszki?


Chrome
Firefox
Edge
Opera
Safari
cursor: wartość1
2008-12-11		1
2004-11-09		12
2015-07-29		7
2003-01-28		1.2
2004-02-02
cursor: alias1
2008-12-11		1.5
2005-11-29		12
2015-07-29		10.6
2010-07-01		3
2007-10-26
cursor: all-scroll1
2008-12-11		1.5
2005-11-29		12
2015-07-29		10.6
2010-07-01		3
2007-10-26
cursor: auto1
2008-12-11		1
2004-11-09		12
2015-07-29		7
2003-01-28		1.2
2004-02-02
cursor: cell1
2008-12-11		1.5
2005-11-29		12
2015-07-29		10.6
2010-07-01		3
2007-10-26
cursor: col-resize1
2008-12-11		1.5
2005-11-29		12
2015-07-29		10.6
2010-07-01		3
2007-10-26
cursor: context-menu1
2008-12-11		1.5
2005-11-29		12
2015-07-29		10.6
2010-07-01		3
2007-10-26
cursor: copy1
2008-12-11		1.5
2005-11-29		12
2015-07-29		10.6
2010-07-01		3
2007-10-26
cursor: crosshair1
2008-12-11		1
2004-11-09		12
2015-07-29		7
2003-01-28		1.2
2004-02-02
cursor: default1
2008-12-11		1
2004-11-09		12
2015-07-29		7
2003-01-28		1.2
2004-02-02
cursor: e-resize1
2008-12-11		1
2004-11-09		12
2015-07-29		7
2003-01-28		1.2
2004-02-02
cursor: ew-resize1
2008-12-11		1.5
2005-11-29		12
2015-07-29		10.6
2010-07-01		3
2007-10-26
cursor: grab68
2018-07-24		27
2014-02-04		14
2016-08-02		55
2018-08-16		11
2017-09-19
cursor: grabbing68
2018-07-24		27
2014-02-04		79
2020-01-15		55
2018-08-16		11
2017-09-19
cursor: help1
2008-12-11		1
2004-11-09		12
2015-07-29		7
2003-01-28		1.2
2004-02-02
cursor: move1
2008-12-11		1
2004-11-09		12
2015-07-29		7
2003-01-28		1.2
2004-02-02
cursor: n-resize1
2008-12-11		1
2004-11-09		12
2015-07-29		7
2003-01-28		1.2
2004-02-02
cursor: ne-resize1
2008-12-11		1
2004-11-09		12
2015-07-29		7
2003-01-28		1.2
2004-02-02
cursor: nesw-resize1
2008-12-11		1.5
2005-11-29		12
2015-07-29		10.6
2010-07-01		3
2007-10-26
cursor: no-drop1
2008-12-11		1.5
2005-11-29		12
2015-07-29		10.6
2010-07-01		3
2007-10-26
cursor: none5
2010-05-25		3
2008-06-17		12
2015-07-29		15
2013-07-02		5
2010-06-07
cursor: not-allowed1
2008-12-11		1.5
2005-11-29		12
2015-07-29		10.6
2010-07-01		3
2007-10-26
cursor: ns-resize1
2008-12-11		1.5
2005-11-29		12
2015-07-29		10.6
2010-07-01		3
2007-10-26
cursor: nw-resize1
2008-12-11		1
2004-11-09		12
2015-07-29		7
2003-01-28		1.2
2004-02-02
cursor: nwse-resize1
2008-12-11		1.5
2005-11-29		12
2015-07-29		10.6
2010-07-01		3
2007-10-26
cursor: pointer1
2008-12-11		1
2004-11-09		12
2015-07-29		7
2003-01-28		1.2
2004-02-02
cursor: progress1
2008-12-11		1
2004-11-09		12
2015-07-29		7
2003-01-28		1.2
2004-02-02
cursor: row-resize1
2008-12-11		1.5
2005-11-29		12
2015-07-29		10.6
2010-07-01		3
2007-10-26
cursor: s-resize1
2008-12-11		1
2004-11-09		12
2015-07-29		7
2003-01-28		1.2
2004-02-02
cursor: se-resize1
2008-12-11		1
2004-11-09		12
2015-07-29		7
2003-01-28		1.2
2004-02-02
cursor: sw-resize1
2008-12-11		1
2004-11-09		12
2015-07-29		7
2003-01-28		1.2
2004-02-02
cursor: text1
2008-12-11		1
2004-11-09		12
2015-07-29		7
2003-01-28		1.2
2004-02-02
cursor: vertical-text1
2008-12-11		1.5
2005-11-29		12
2015-07-29		10.6
2010-07-01		3
2007-10-26
cursor: w-resize1
2008-12-11		1
2004-11-09		12
2015-07-29		7
2003-01-28		1.2
2004-02-02
cursor: wait1
2008-12-11		1
2004-11-09		12
2015-07-29		7
2003-01-28		1.2
2004-02-02
cursor: zoom-in37
2014-08-26		24
2013-09-17		12
2015-07-29		24
2014-09-02		9
2015-09-30
cursor: zoom-out37
2014-08-26		24
2013-09-17		12
2015-07-29		24
2014-09-02		9
2015-09-30

Kursor obrazkowy {cursor: url}

Jak wczytać kursor (wskaźnik) myszki z pliku?


Chrome
Firefox
Edge
Opera
Safari
cursor: url1
2008-12-11		1.5
2005-11-29		12
2015-07-29		15
2013-07-02		3
2007-10-26

Kolor karetki tekstowej {caret-color}

W jaki sposób zmienić kolor migającego wskaźnika (karetki, kursora), który pojawia się podczas wpisywania tekstu z klawiatury?


Chrome
Firefox
Edge
Opera
Safari
caret-color: wartość57
2017-03-09		53
2017-04-19		79
2020-01-15		44
2017-03-21		11.1
2018-04-12

Drukowanie CSS

Przełamanie strony {page-break-before, page-break-after}

Jak rozpocząć nową stronę papieru w określonym miejscu na wydruku?

❌ Nie działa

Chrome
Firefox
Edge
Opera
Safari
page-break-after: wartość1
2008-12-11		1
2004-11-09		12
2015-07-29		7
2003-01-28		1.2
2004-02-02
page-break-after: always1
2008-12-11		1
2004-11-09		12
2015-07-29		15
2013-07-02		1.2
2004-02-02
page-break-after: auto1
2008-12-11		1
2004-11-09		12
2015-07-29		15
2013-07-02		1.2
2004-02-02
page-break-after: avoid1
2008-12-11		❌12
2015-07-29		15
2013-07-02		❌
page-break-after: left1
2008-12-11		1
2004-11-09		12
2015-07-29		15
2013-07-02		1.2
2004-02-02
page-break-after: right1
2008-12-11		1
2004-11-09		12
2015-07-29		15
2013-07-02		1.2
2004-02-02
page-break-before: wartość1
2008-12-11		1
2004-11-09		12
2015-07-29		7
2003-01-28		1.2
2004-02-02
page-break-before: always1
2008-12-11		1
2004-11-09		12
2015-07-29		15
2013-07-02		1.2
2004-02-02
page-break-before: auto1
2008-12-11		1
2004-11-09		12
2015-07-29		15
2013-07-02		1.2
2004-02-02
page-break-before: avoid1
2008-12-11		❌12
2015-07-29		15
2013-07-02		❌
page-break-before: left1
2008-12-11		1
2004-11-09		12
2015-07-29		15
2013-07-02		1.2
2004-02-02
page-break-before: right1
2008-12-11		1
2004-11-09		12
2015-07-29		15
2013-07-02		1.2
2004-02-02

Blokada przełamania strony {page-break-inside}

Jak nie dopuścić, aby na wydruku pierwsza część elementu znalazła się na jednej stronie papieru, a dalsza na drugiej?


Chrome
Firefox
Edge
Opera
Safari
page-break-inside: wartość1
2008-12-11		19
2013-02-19		12
2015-07-29		7
2003-01-28		1.3
2005-04-15
page-break-inside: auto1
2008-12-11		19
2013-02-19		12
2015-07-29		15
2013-07-02		1.3
2005-04-15
page-break-inside: avoid1
2008-12-11		19
2013-02-19		12
2015-07-29		15
2013-07-02		1.3
2005-04-15

Linijki na stronie {widows, orphans}

W jaki sposób poprawić estetykę wydruku, kontrolując liczbę linijek wdowich (na górze) i sierocych (na dole)?

❌ Nie działa

Chrome
Firefox
Edge
Opera
Safari
orphans: wartość25
2013-02-21		❌12
2015-07-29		9.2
2007-04-11		1.3
2005-04-15
widows: wartość25
2013-02-21		❌12
2015-07-29		9.2
2007-04-11		1.3
2005-04-15

Kontekst strony @page

Jak ustawić marginesy strony na wydruku?


Chrome
Firefox
Edge
Opera
Safari
@page2
2009-05-21		19
2013-02-19		12
2015-07-29		6
2001-12-18		18.2
2024-12-11
@page { size: wartość }15
2011-10-25		95
2021-12-07		79
2020-01-15		15
2013-07-02		18.2
2024-12-11

Okładka wydruku @page :first

Jak wyzerować marginesy na okładce wydruku?


Chrome
Firefox
Edge
Opera
Safari
:first18
2012-03-28		116
2023-08-01		12
2015-07-29		9.2
2007-04-11		6
2012-07-25

Druk dwustronny @page :left :right

W jaki sposób przygotować druk dwustronny, tak aby potem wszystkie kartki można było wygodnie spiąć jak książkę?

❌ Nie działa

Chrome
Firefox
Edge
Opera
Safari
:left6
2010-09-02		❌12
2015-07-29		9.2
2007-04-11		5
2010-06-07
:right6
2010-09-02		❌12
2015-07-29		9.2
2007-04-11		5
2010-06-07

Rozmiar papieru @page {size}

Co zrobić, żeby strona WWW była drukowana na kartce w orientacji poziomej? Jak obrócić drukowane zdjęcie? W jaki sposób wydrukować stronę na kartce w formacie A5, A3, B5 lub B4?


Chrome
Firefox
Edge
Opera
Safari
@page { size: wartość }15
2011-10-25		95
2021-12-07		79
2020-01-15		15
2013-07-02		18.2
2024-12-11
@page { size: jis-b4 }83
2020-05-19		95
2021-12-07		83
2020-05-21		69
2020-06-24		18.2
2024-12-11
@page { size: jis-b5 }83
2020-05-19		95
2021-12-07		83
2020-05-21		69
2020-06-24		18.2
2024-12-11

Typ strony wydruku {page}

W jaki sposób wydrukować część stron poziomo, a pozostałe pionowo?


Chrome
Firefox
Edge
Opera
Safari
page: wartość85
2020-08-25		110
2023-02-14		85
2020-08-27		71
2020-09-15		1
2003-06-23

Układ wielokolumnowy CSS

Szerokość kolumny {column-width}

Jak ustalić szerokość kolumny tekstu?


Chrome
Firefox
Edge
Opera
Safari
column-width: wartość50
2016-04-13		50
2016-11-15		12
2015-07-29		11.1
2011-04-12		9
2015-09-30
column-width: auto1
2008-12-11		1.5
2005-11-29		12
2015-07-29		15
2013-07-02		3
2007-10-26

Liczba kolumn {column-count}

W jaki sposób podzielić tekst na kilka kolumn?


Chrome
Firefox
Edge
Opera
Safari
column-count: wartość50
2016-04-13		52
2017-03-07		12
2015-07-29		37
2016-05-04		9
2015-09-30
column-count: auto1
2008-12-11		1.5
2005-11-29		12
2015-07-29		15
2013-07-02		3
2007-10-26

Atrybuty mieszane kolumn {columns}

Jak za jednym razem ustalić szerokość kolumny i liczbę kolumn?


Chrome
Firefox
Edge
Opera
Safari
columns: wartość50
2016-04-13		52
2017-03-07		12
2015-07-29		11.1
2011-04-12		9
2015-09-30

Odstęp kolumn {column-gap}

W jaki sposób ustalić odstęp pomiędzy dwiema kolumnami tekstu?


Chrome
Firefox
Edge
Opera
Safari
column-gap: wartość1
2008-12-11		1.5
2005-11-29		12
2015-07-29		11.1
2011-04-12		3
2007-10-26
column-gap: normal1
2008-12-11		1.5
2005-11-29		12
2015-07-29		11.1
2011-04-12		3
2007-10-26

Linia rozdzielająca kolumn {column-rule-color, column-rule-style, column-rule-width, column-rule}

W jaki sposób dodać pionową linię rozdzielającą kolumny tekstu?


Chrome
Firefox
Edge
Opera
Safari
column-rule-color: wartość50
2016-04-13		52
2017-03-07		12
2015-07-29		11.1
2011-04-12		9
2015-09-30
column-rule-style: wartość50
2016-04-13		52
2017-03-07		12
2015-07-29		11.1
2011-04-12		9
2015-09-30
column-rule-width: wartość50
2016-04-13		52
2017-03-07		12
2015-07-29		11.1
2011-04-12		9
2015-09-30
column-rule: wartość50
2016-04-13		52
2017-03-07		12
2015-07-29		11.1
2011-04-12		9
2015-09-30

Przełamanie kolumny {break-before, break-inside, break-after}

Jak zapewnić estetyczne przełamania kolumn tekstu na stronie?

❌ Nie działa

Chrome
Firefox
Edge
Opera
Safari
break-before: wartość50
2016-04-13		65
2019-01-29		12
2015-07-29		37
2016-05-04		10
2016-09-20
break-before: avoid-column50
2016-04-13		❌79
2020-01-15		37
2016-05-04		10
2016-09-20
break-before: column50
2016-04-13		❌79
2020-01-15		37
2016-05-04		10
2016-09-20
break-after: wartość50
2016-04-13		65
2019-01-29		12
2015-07-29		37
2016-05-04		10
2016-09-20
break-after: avoid-column50
2016-04-13		❌79
2020-01-15		37
2016-05-04		10
2016-09-20
break-after: column50
2016-04-13		❌79
2020-01-15		37
2016-05-04		10
2016-09-20
break-inside: wartość50
2016-04-13		65
2019-01-29		12
2015-07-29		37
2016-05-04		10
2016-09-20
break-inside: avoid-column50
2016-04-13		92
2021-09-07		79
2020-01-15		37
2016-05-04		10
2016-09-20

Łączenie kolumn {column-span}

W jaki sposób wstawić element rozciąjący się ponad kilkoma kolumnami tekstu?


Chrome
Firefox
Edge
Opera
Safari
column-span: wartość50
2016-04-13		71
2019-12-10		12
2015-07-29		37
2016-05-04		9
2015-09-30
column-span: all6
2010-09-02		71
2019-12-10		12
2015-07-29		15
2013-07-02		5.1
2011-07-20
column-span: none6
2010-09-02		71
2019-12-10		12
2015-07-29		15
2013-07-02		5.1
2011-07-20

Wypełnienie kolumn {column-fill}

Jak określić wypełnienie elementu kolumnami tekstu?


Chrome
Firefox
Edge
Opera
Safari
column-fill: wartość50
2016-04-13		52
2017-03-07		12
2015-07-29		37
2016-05-04		9
2015-09-30
column-fill: auto50
2016-04-13		17
2012-11-20		12
2015-07-29		37
2016-05-04		8
2014-10-16
column-fill: balance50
2016-04-13		17
2012-11-20		12
2015-07-29		37
2016-05-04		8
2014-10-16

Układ elastyczny CSS

Kontener elastyczny {display: flex inline-flex}

Jak przełączyć sposób rozpalnowania elementów na układ elastyczny?


Chrome
Firefox
Edge
Opera
Safari
display: flex29
2013-08-20		20
2013-04-02		12
2015-07-29		16
2013-08-27		9
2015-09-30
display: inline-flex29
2013-08-20		20
2013-04-02		12
2015-07-29		16
2013-08-27		9
2015-09-30

Przepływ elastyczny {flex-direction, flex-wrap, flex-flow}

W jaki sposób ustawić elastycznie elementy w wierszach lub kolumnach w różnych kierunkach?


Chrome
Firefox
Edge
Opera
Safari
flex-direction: wartość29
2013-08-20		20
2013-04-02		12
2015-07-29		12.1
2012-11-20		9
2015-09-30
flex-direction: column21
2012-07-31		≤72
2020-01-07		12
2015-07-29		15
2013-07-02		7
2013-10-22
flex-direction: column-reverse21
2012-07-31		81
2020-09-22		12
2015-07-29		15
2013-07-02		7
2013-10-22
flex-direction: row21
2012-07-31		≤72
2020-01-07		12
2015-07-29		15
2013-07-02		7
2013-10-22
flex-direction: row-reverse21
2012-07-31		81
2020-09-22		12
2015-07-29		15
2013-07-02		7
2013-10-22
flex-wrap: wartość29
2013-08-20		28
2014-03-18		12
2015-07-29		16
2013-08-27		9
2015-09-30
flex-wrap: nowrap21
2012-07-31		28
2014-03-18		12
2015-07-29		15
2013-07-02		7
2013-10-22
flex-wrap: wrap21
2012-07-31		28
2014-03-18		12
2015-07-29		15
2013-07-02		7
2013-10-22
flex-wrap: wrap-reverse21
2012-07-31		28
2014-03-18		12
2015-07-29		15
2013-07-02		7
2013-10-22
flex-flow: wartość29
2013-08-20		28
2014-03-18		12
2015-07-29		12.1
2012-11-20		9
2015-09-30

Kolejność {order}

Jak zmienić kolejność wyświetlania elementów na stronie?


Chrome
Firefox
Edge
Opera
Safari
order: wartość29
2013-08-20		20
2013-04-02		12
2015-07-29		12.1
2012-11-20		9
2015-09-30

Elastyczność {flex-grow, flex-shrink, flex-basis, flex}

Jak sprawić, aby rozmiary elementów elastycznie dopasowały się do ich zawartości w wolnej przestrzeni na stronie?


Chrome
Firefox
Edge
Opera
Safari
flex-grow: wartość29
2013-08-20		20
2013-04-02		12
2015-07-29		12.1
2012-11-20		9
2015-09-30
flex-shrink: wartość29
2013-08-20		20
2013-04-02		12
2015-07-29		12.1
2012-11-20		9
2015-09-30
flex-basis: wartość29
2013-08-20		22
2013-06-25		12
2015-07-29		12.1
2012-11-20		9
2015-09-30
flex-basis: auto22
2012-09-25		22
2013-06-25		12
2015-07-29		12.1
2012-11-20		9
2015-09-30
flex: wartość29
2013-08-20		20
2013-04-02		12
2015-07-29		12.1
2012-11-20		9
2015-09-30
flex: none21
2012-07-31		≤72
2020-01-07		12
2015-07-29		15
2013-07-02		7
2013-10-22

Justowanie zawartości {justify-content}

Jak równomiernie wyrównać elementy na stronie?


Chrome
Firefox
Edge
Opera
Safari
justify-content: wartość29
2013-08-20		20
2013-04-02		12
2015-07-29		12.1
2012-11-20		9
2015-09-30

Wyrównanie wiersza {align-items, align-self}

Co zrobić, aby wyśrodkować blok w pionie?


Chrome
Firefox
Edge
Opera
Safari
align-items: wartość29
2013-08-20		20
2013-04-02		12
2015-07-29		16
2013-08-27		9
2015-09-30
align-self: wartość29
2013-08-20		20
2013-04-02		12
2015-07-29		12.1
2012-11-20		9
2015-09-30

Wyrównanie wierszy {align-content}

Jak ustawić bloki w wierszach na dole, na górze albo równomiernie na całej dostępnej wysokości?


Chrome
Firefox
Edge
Opera
Safari
align-content: wartość29
2013-08-20		28
2014-03-18		12
2015-07-29		16
2013-08-27		9
2015-09-30

Media CSS

Wybór medium @media

Jak określić specjalny wygląd strony w wersji do wydruku czy na urządzenia przenośne?


Chrome
Firefox
Edge
Opera
Safari
@media1
2008-12-11		1
2004-11-09		12
2015-07-29		9.2
2007-04-11		3
2007-10-26

Zapytania mediów

Jak stworzyć stronę, która automatycznie dopasowuje się do możliwości urządzenia: komputer, tablet, smartphone, telewizor, projektor?

❌ Nie działa

Chrome
Firefox
Edge
Opera
Safari
@media1
2008-12-11		1
2004-11-09		12
2015-07-29		9.2
2007-04-11		3
2007-10-26
@media (aspect-ratio)3
2009-09-15		3.5
2009-06-30		12
2015-07-29		10
2009-09-01		5
2010-06-07
@media (color)1
2008-12-11		2
2006-10-24		12
2015-07-29		10
2009-09-01		3
2007-10-26
@media (color-index)29
2013-08-20		❌79
2020-01-15		16
2013-08-27		8
2014-10-16
@media (device-aspect-ratio)1
2008-12-11		2
2006-10-24		12
2015-07-29		10
2009-09-01		3
2007-10-26
@media (device-height)1
2008-12-11		2
2006-10-24		12
2015-07-29		10
2009-09-01		3
2007-10-26
@media (device-width)1
2008-12-11		2
2006-10-24		12
2015-07-29		10
2009-09-01		3
2007-10-26
@media (grid)1
2008-12-11		2
2006-10-24		12
2015-07-29		10
2009-09-01		3
2007-10-26
@media (height)1
2008-12-11		2
2006-10-24		12
2015-07-29		10
2009-09-01		3
2007-10-26
@media (monochrome)1
2008-12-11		2
2006-10-24		79
2020-01-15		10
2009-09-01		3
2007-10-26
@media (orientation)3
2009-09-15		2
2006-10-24		12
2015-07-29		10.6
2010-07-01		5
2010-06-07
@media (resolution)29
2013-08-20		8
2011-11-08		12
2015-07-29		16
2013-08-27		16
2022-09-12
@media (width)1
2008-12-11		2
2006-10-24		12
2015-07-29		10
2009-09-01		3
2007-10-26

Reguły warunkowe CSS

Zapytania właściwości @supports

W jaki sposób zapewnić prawidłowy wygląd strony WWW nawet w starszych przeglądarkach?


Chrome
Firefox
Edge
Opera
Safari
@supports28
2013-07-09		22
2013-06-25		12
2015-07-29		12.1
2012-11-20		9
2015-09-30

Jednostki CSS

Długość


Chrome
Firefox
Edge
Opera
Safari
vw20
2012-06-26		19
2013-02-19		12
2015-07-29		20
2014-03-04		6
2012-07-25
vh20
2012-06-26		19
2013-02-19		12
2015-07-29		20
2014-03-04		6
2012-07-25
vmin26
2013-03-26		19
2013-02-19		12
2015-07-29		15
2013-07-02		7
2013-10-22
vmax26
2013-03-26		19
2013-02-19		16
2017-10-17		15
2013-07-02		7
2013-10-22
ch27
2013-05-21		1
2004-11-09		12
2015-07-29		15
2013-07-02		7
2013-10-22
rem4
2010-01-25		3.6
2010-01-21		12
2015-07-29		11.6
2011-12-06		5
2010-06-07

Rozdzielczość


Chrome
Firefox
Edge
Opera
Safari
dpi29
2013-08-20		8
2011-11-08		12
2015-07-29		16
2013-08-27		16
2022-09-12
dpcm29
2013-08-20		8
2011-11-08		12
2015-07-29		16
2013-08-27		16
2022-09-12
dppx29
2013-08-20		16
2012-10-09		12
2015-07-29		12.1
2012-11-20		16
2022-09-12

Wyrażenia matematyczne


Chrome
Firefox
Edge
Opera
Safari
calc26
2013-03-26		16
2012-10-09		12
2015-07-29		15
2013-07-02		7
2013-10-22

Kolory CSS

Sposoby definiowania kolorów CSS


Chrome
Firefox
Edge
Opera
Safari
#RRGGBB, #RGB1
2008-12-11		1
2004-11-09		12
2015-07-29		3.5
1998-11-18		1
2003-06-23
rgb1
2008-12-11		1
2004-11-09		12
2015-07-29		3.5
1998-11-18		1
2003-06-23
rgba65
2018-03-06		52
2017-03-07		79
2020-01-15		52
2018-03-22		12.1
2019-03-25
hsl1
2008-12-11		1
2004-11-09		12
2015-07-29		9.5
2008-06-12		3.1
2008-03-18
hsla65
2018-03-06		52
2017-03-07		79
2020-01-15		52
2018-03-22		12.1
2019-03-25
transparent1
2008-12-11		3
2008-06-17		12
2015-07-29		10
2009-09-01		3.1
2008-03-18
currentColor1
2008-12-11		1.5
2005-11-29		12
2015-07-29		9.5
2008-06-12		4
2009-06-08

Wykaz kolorów systemowych


Chrome
Firefox
Edge
Opera
Safari
color: system1
2008-12-11		1
2004-11-09		12
2015-07-29		3.5
1998-11-18		1
2003-06-23

Wykaz kolorów rozszerzonych


Chrome
Firefox
Edge
Opera
Safari
color: nazwa1
2008-12-11		1
2004-11-09		12
2015-07-29		3.5
1998-11-18		1
2003-06-23

Komendy CSS 2

bottom


Chrome
Firefox
Edge
Opera
Safari
bottom: wartość1
2008-12-11		1
2004-11-09		12
2015-07-29		6
2001-12-18		1
2003-06-23
bottom: auto1
2008-12-11		1
2004-11-09		12
2015-07-29		15
2013-07-02		1
2003-06-23

content


Chrome
Firefox
Edge
Opera
Safari
content: wartość1
2008-12-11		1
2004-11-09		12
2015-07-29		4
2000-06-28		1
2003-06-23

direction


Chrome
Firefox
Edge
Opera
Safari
direction: wartość2
2009-05-21		1
2004-11-09		12
2015-07-29		9.2
2007-04-11		1
2003-06-23
direction: ltr2
2009-05-21		1
2004-11-09		12
2015-07-29		15
2013-07-02		1
2003-06-23
direction: rtl2
2009-05-21		1
2004-11-09		12
2015-07-29		15
2013-07-02		1
2003-06-23

left


Chrome
Firefox
Edge
Opera
Safari
left: wartość1
2008-12-11		1
2004-11-09		12
2015-07-29		5
2000-12-06		1
2003-06-23
left: auto1
2008-12-11		1
2004-11-09		12
2015-07-29		15
2013-07-02		1
2003-06-23

position


Chrome
Firefox
Edge
Opera
Safari
position: wartość1
2008-12-11		1
2004-11-09		12
2015-07-29		4
2000-06-28		1
2003-06-23
position: absolute1
2008-12-11		1
2004-11-09		12
2015-07-29		15
2013-07-02		1
2003-06-23
position: fixed1
2008-12-11		1
2004-11-09		12
2015-07-29		4
2000-06-28		1
2003-06-23
position: relative1
2008-12-11		1
2004-11-09		12
2015-07-29		15
2013-07-02		1
2003-06-23
position: static1
2008-12-11		1
2004-11-09		12
2015-07-29		15
2013-07-02		1
2003-06-23

right


Chrome
Firefox
Edge
Opera
Safari
right: wartość1
2008-12-11		1
2004-11-09		12
2015-07-29		5
2000-12-06		1
2003-06-23
right: auto1
2008-12-11		1
2004-11-09		12
2015-07-29		15
2013-07-02		1
2003-06-23

speak

❌ Nie działa   🔷 Zawiera błędy

Chrome
Firefox
Edge
Opera
Safari
speak: wartość🔷 ≤80
2020-02-04		❌🔷 ≤80
2020-02-07		🔷 ≤67
2020-03-03		❌

top


Chrome
Firefox
Edge
Opera
Safari
top: wartość1
2008-12-11		1
2004-11-09		12
2015-07-29		6
2001-12-18		1
2003-06-23
top: auto1
2008-12-11		1
2004-11-09		12
2015-07-29		15
2013-07-02		1
2003-06-23

unicode-bidi


Chrome
Firefox
Edge
Opera
Safari
unicode-bidi: wartość2
2009-05-21		1
2004-11-09		12
2015-07-29		9.2
2007-04-11		1.3
2005-04-15
unicode-bidi: bidi-override2
2009-05-21		1
2004-11-09		12
2015-07-29		15
2013-07-02		1.3
2005-04-15
unicode-bidi: embed2
2009-05-21		1
2004-11-09		12
2015-07-29		15
2013-07-02		1.3
2005-04-15
unicode-bidi: normal2
2009-05-21		1
2004-11-09		12
2015-07-29		15
2013-07-02		1.3
2005-04-15

JS

Wstęp do JavaScript i ECMAScript

Jak osadzić skrypt JavaScript na stronie?

W jaki sposób wstawić kod JavaScript na stronie internetowej?


Chrome
Firefox
Edge
Opera
Safari
<script>1
2008-12-11		1
2004-11-09		12
2015-07-29		≤12.1
2012-11-20		3
2007-10-26
<script async>1
2008-12-11		3.6
2010-01-21		12
2015-07-29		15
2013-07-02		≤4
2009-06-08
<script defer>1
2008-12-11		3.5
2009-06-30		12
2015-07-29		15
2013-07-02		3
2007-10-26
<script src>1
2008-12-11		1
2004-11-09		12
2015-07-29		15
2013-07-02		≤4
2009-06-08
<script type>1
2008-12-11		1
2004-11-09		12
2015-07-29		15
2013-07-02		≤4
2009-06-08

★★★★☆ 4/5 (11)

Czytaj dalej

Aby kontynuować kurs, przejdź do poprzedniego lub następnego artykułu:

Facebook