Middle+

Čime se razlikuju rem od em?

sobes.tech АИ

Одговор од АИ

rem i em su relativne jedinice mere u CSS-u, koje se koriste za određivanje dimenzija, ali se razlikuju u osnovnoj referentnoj osnovi.

em — relativna jedinica zasnovana na veličini fonta roditeljskog elementa. Na primer, ako je veličina fonta roditelja: 16px, onda je 1em = 16px. Ako je u detetovom elementu veličina fonta: 1.5em, njegova veličina će biti 24px.
rem — relativna jedinica zasnovana na veličini fonta korenskog elementa (obično <html>). Na primer, ako <html> ima veličinu fonta: 16px, onda je 1rem uvek jednak 16px, bez obzira na ugnježdenje.

Glavna razlika:

em zavisi od konteksta (od roditeljskog elementa), što može dovesti do lančanog množenja dimenzija pri ugnježdenju.
rem je uvek fiksno u odnosu na koren, što olakšava upravljanje dimenzijama i čini ih predvidljivijim.

Primer:

html {
  font-size: 16px;
}

.parent {
  font-size: 20px; /* 1em = 20px unutar .parent */
}

.child-em {
  font-size: 1.5em; /* 1.5 * 20px = 30px */
}

.child-rem {
  font-size: 1.5rem; /* 1.5 * 16px = 24px */
}

Koristite rem za globalne dimenzije da biste izbegli neočekivane promene, a em kada želite da skalirate u odnosu na lokalni kontekst.

Претходно Следеће