Middle+

Ինչն է տարբերությունը rem և em միջև?

sobes.tech AI

Պատասխան AI-ից

rem և em-ը հարաբերական չափման միավորներ են CSS-ում, որոնք օգտագործվում են չափերի սահմանման համար, բայց տարբեր են հղման հիմքով:

em — հարաբերական միավոր է, որը հիմնված է ծնողական տարրերի տառաչափի վրա: Օրինակ, եթե ծնողի տառաչափը՝ 16px, ապա 1em = 16px: Եթե երեխա տարրում տառաչափը՝ 1.5em է, ապա նրա չափը կլինի 24px:
rem — հարաբերական միավոր է, որը հիմնված է արմատային տարրի (հաճախ <html>) տառաչափի վրա: Օրինակ, եթե <html>-ի տառաչափը՝ 16px, ապա 1rem միշտ հավասար է 16px-ին, անկախ նեստինգից:

Հիմնական տարբերությունը՝

em-ը կախված է կոնտեքստից (հետին տարրից), ինչը կարող է հանգեցնել չափերի շղթայական բազմապատկման նեստինգի ժամանակ:
rem-ը միշտ ֆիքսված է ռուտից, ինչը հեշտացնում է չափերի կառավարումը և դարձնում ավելի կանխատեսելի:

Օրինակ՝

html {
  font-size: 16px;
}

.parent {
  font-size: 20px; /* 1em = 20px `.parent`-ի ներսում */
}

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

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

Օգտագործեք rem՝ գլոբալ չափերի համար՝ անակնկալ փոփոխությունները կանխելու համար, և em՝ երբ անհրաժեշտ է մասշտաբավորել տեղական կոնտեքստի հարաբերությամբ։

Նախորդ Հաջորդը