logo

Diferența dintre unitățile em și rem în CSS

Când setăm dimensiunea oricărui element în CSS, avem două opțiuni. Prima este unități absolute, iar cealaltă este unități relative. Unitățile absolute sunt fixe și nu relative la nimic altceva. Ele sunt întotdeauna identice în orice caz. Ele implică cm, mm, px, etc. Pe de altă parte, unitățile relative sunt relative la altceva. Poate fi dimensiunea elementului părinte sau dimensiunea HTML-ului principal. Unitățile relative acoperă em, rem, vw, vh etc. Acestea sunt unități scalabile și ajută la proiectarea receptivă. Mulți dintre noi s-ar putea confunda între unitățile relative, în special între în si rem unitati. Să defalcăm diferența dintre cele două. Practic, atât rem, cât și em sunt unități scalabile și relative de dimensiune, dar cu em, unitatea este relativă la dimensiunea fontului elementului său părinte, în timp ce unitatea rem este doar relativă la dimensiunea fontului rădăcină a documentului HTML. R in rem reprezintă rădăcină.

Să le înțelegem pe amândouă în detaliu.



1. în United: Unitatea em permite setarea dimensiunii fontului unui element în raport cu dimensiunea fontului părintelui său. Când dimensiunea elementului părinte se modifică, dimensiunea copilului se schimbă automat.

Notă: Când unitățile em sunt utilizate pe proprietatea font-size, dimensiunea este relativă la dimensiunea fontului părintelui. Când este utilizat pe alte proprietăți, este relativ la dimensiunea fontului acelui element în sine. Aici, doar prima declarație ia referința părintelui.

  • Dimensiunea fontului elementului .child va fi 40px (2*20px).
  • Marja de .copil va fi 60px . Aceasta este de 1,5 ori dimensiunea fontului elementului nostru (1,5*40px).

Exemplu: Acest exemplu arată utilizarea unității em în CSS.



cum se convertesc int în șir

HTML






> <>html>>>> <>head>>>>> <>title>>Em vs Remtitle> cap>