CSSте селекторлордун мурас болушу эмнеге болот?

CSSтеги мурас алуу, стиль өзгөчөлүктөрү ата-элементтерден алардын балдарына өткөрүлүшү мүмкүн болгондуктан болот. Бул CSS спецификациясы тарабынан аныкталган, стиль түзүүнү жөнөкөйлөтүү жана кодду кайталоодон сактоо үчүн.

Бардык CSS өзгөчөлүктөрү мурас албайт. Мына кээ бир мурас алынып жана мурас албай турган өзгөчөлүктөрдүн мисалдары:

Мурас алынып жаткан өзгөчөлүктөр	Мурас албай турган өзгөчөлүктөр
text-align	border
color	margin
font-family	padding
font-size	background
line-height	width
list-style-type	height

Мурас алуу механизми браузер тарабынан HTML документиндеги (DOM дарагы) элементтердин хиерархиясына негизделген. Эгер балдар элементине мурас алынып жаткан өзгөчөлүк үчүн ачык маанилер берилбесе, ал эң жакын ата-элементтен алат, ал бул өзгөчөлүктү аныктаган.

/* Түс кызыл кылынат */
body {
  color: red;
}

/* Bodyнин бардык балдары, color өзгөчөлүгү аныкталбаган болсо, кызыл болот */
p {
  /* Бул параграф кызыл болот */
}

/* Белгилүү бир элемент үчүн color өзгөчөлүгүн кайра аныктоо */
div {
  color: blue;
}

/* Бул div ичиндеги параграф көк болот */
div p {
  /* Бул параграф көк болот */
}

Мурас алуу аркылуу, чоң мазмун блоктору үчүн жалпы стильдер белгилөө мүмкүн, алар автоматтык түрдө балдар элементтер тарабынан кабыл алынат, эгер башкача көрсөтүлбөсө. Бул коддун кармалышын жана окумдуулугун жакшыртат.