Sobes.tech
Middle+

rem və em nə ilə fərqlənir?

sobes.tech Süni İntellekt

AI-dan cavab

rem və em CSS-də nisbi ölçü vahidləridir, ölçüləri təyin etmək üçün istifadə olunur, lakin onlar əsas referans bazası ilə fərqlənir.

  • em — valideyn elementin şrift ölçüsünə əsaslanan nisbi vahiddir. Məsələn, əgər valideynin şrift ölçüsü: 16px-dirsə, onda 1em = 16px. Əgər uşaq elementdə şrift ölçüsü: 1.5em-dirsə, onun ölçüsü 24px olacaq.

  • rem — kök elementin (adətən <html>) şrift ölçüsünə əsaslanan nisbi vahiddir. Məsələn, <html>-in şrift ölçüsü: 16px-dirsə, onda 1rem həmişə 16px-ə bərabərdir, nestingdən asılı olmayaraq.

Əsas fərq:

  • em kontekstdən (valideyn) asılıdır, bu da nesting zamanı ölçülərin zəncirvari çoxalmasına səbəb ola bilər.
  • rem isə həmişə kökə nisbətən sabitdir, bu da ölçülərin idarə olunmasını sadələşdirir və daha proqnozlaşdırılandır.

Nümunə:

html {
  font-size: 16px;
}

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

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

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

Qlobal ölçülər üçün rem istifadə edin, gözlənilməz dəyişikliklərin qarşısını almaq üçün, və em istifadə edin, lokal kontekstə görə ölçmək istədiyiniz zaman.