Při nastavování velikosti libovolného prvku v CSS máme dvě možnosti. První jsou absolutní jednotky a další jednotky relativní. Absolutní jednotky jsou pevné a nejsou relativní k ničemu jinému. V každém případě jsou vždy totožné. Zahrnují cm, mm, px atd. Na druhé straně relativní jednotky jsou relativní k něčemu jinému. Může to být velikost nadřazeného prvku nebo velikost hlavního HTML. Relativní jednotky pokrývají em, rem, vw, vh atd. Jedná se o škálovatelné jednotky a pomáhají v responzivním designu. Mnoho z nás by mohlo být zmateno mezi relativními jednotkami, zejména jednotkami v a rem Jednotky. Pojďme rozebrat rozdíl mezi těmito dvěma. V zásadě platí, že jak rem, tak em jsou škálovatelné a relativní jednotky velikosti, ale u em je jednotka relativní k velikosti písma jeho nadřazeného prvku, zatímco jednotka rem je pouze relativní ke kořenové velikosti písma HTML dokumentu. R v rem znamená kořen.

Pojďme si je oba podrobně porozumět.

1. ve Spojených státech: Jednotka em umožňuje nastavení velikosti písma prvku vzhledem k velikosti písma jeho rodiče. Když se změní velikost nadřazeného prvku, automaticky se změní velikost podřízeného prvku.

Poznámka: Když jsou jednotky em použity ve vlastnosti font-size, je velikost relativní k velikosti fontu rodiče. Při použití v jiných vlastnostech je relativní k velikosti písma samotného prvku. Zde pouze první deklarace přebírá odkaz na rodiče.

.tostring java

• Velikost písma prvku .child bude 40 pixelů (2*20px).
• Okraj .child bude 60 pixelů . To je 1,5násobek velikosti písma našeho prvku (1,5*40px).

Příklad: Tento příklad ukazuje použití jednotky em v CSS.

HTML