Wielkość tagów h1, h2, ...

Question

Cześć!

Jakie są dokładne (w pikselach) wielkości nagłówków h1, h2, itd.?

Answer 1

Na to pytanie nie da się odpowiedzieć, bo standard HTML określa ich wielkość w em​​​, co oznacza, że zależą od domyślnej wielkości fonta. A tej nie określa żaden standard (CSS Fonts Module mówi o wielkości "medium") i jest to zależne od przeglądarki.

Comments

@Comandeer, mam pytanie poboczne - w jaki sposób znalazłeś stronę specki, która określa rozmiar czcionek? Na MDN są linki do specek, ale w nich nie ma nic o wielkości czcionek:

https://html.spec.whatwg.org/multipage/sections.html#the-h1,-h2,-h3,-h4,-h5,-and-h6-elements

https://www.w3.org/TR/html52/sections.html#the-h1-h2-h3-h4-h5-and-h6-elements

Na MDN jest link do specki na stronie WHATWG /sections.html, a informacje o rozmiarach czcionkach znalazłeś na WHATWG /rendering.html.

Ciekawi mnie po prostu metodologia szukania stron do konkretnych zagadnień w speckach HTML/CSS - bo do tej pory myślałem, że MDN pokrywa wszystkie "przypadki", ale jak widać nie bardzo.

Po wpisaniu w Google "html h1 headings font-size specification" też mi nie znalazło tej konkretnej strony specki. Na stronie https://html.spec.whatwg.org/ nie widzę jakiejś wyszukiwarki, więc chyba trzeba po prostu wiedzieć jakie są poszczególne strony specki, na której są dane informacje?

---

Prawdę mówiąc siedzę w tym już tak głęboko, że faktycznie wiem, gdzie dana rzecz się w specyfikacji znajduje. Nie mam metodyki, po prostu biorę to z pamięci.

Answer 2

https://www.w3schools.com/cssref/css_default_values.asp

Comments

Dodam tylko, że przeglądarki często przyjmują domyślny rozmiar czcionki jako 16 pikseli. Łatwo zatem przeliczyć wielkość w em na rozmiar w px.

---

@Tomek Sochacki, nie wiem, do czego dokładnie zalinkowałeś, ale to jest jakaś kopia W3Schools na bardzo dziwnym serwerze.

---

Dodatkowo na tej liście są nie do końca poprawne informacje, niezgodne zarówno ze specyfikacją HTML, jak i domyślnymi arkuszami przeglądarek.

---

przyznam, że to pierwszy z linków jakie dostałem w google na default css, musiałem przypadkowo  zescrollować ekran i się nie zorientowałem :)