Сиздин Чектерди жана чектерди Out нөлгө CSS колдонуу

Бүгүнкү интернет браузер кайчылаш-серепчи ырааттуулук кандайдыр бир куру кыял болгон жинди күнгө чейин узак жолду басып калды. Бүгүнкү браузерлер абдан стандарттарды-жооп болуп саналат. Алар сонун чогуу ойноп, ар турдуу браузерлерди боюнча бир кыйла ырааттуу бет дисплейди тартуулайбыз. Бул боюнча Google Chrome акыркы, Microsoft Edge, Mozilla Firefox, опера, Safari, жана ар турдуу браузерлерди камтыйт мобилдик аппараттардын карды бүгүн сайтына кирүү үчүн колдонулат.

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

Анткени бокс үлгүсү бул аспектилердин күчүнө баарын HTML элементтери, алар бет долбоорду түзүү маанилүү, анткени, бир кылка дисплей бет деген бир браузерде көрктүү көрүнөт, бирок башка өчүрүү аз көрүнүшү мүмкүн. Бул көйгөйдү алдын алуу үчүн көптөгөн интернет дизайнерлери бокс үлгүсү ушул аспектилерди нормалдаштырат. Бул тажрыйба, ошондой эле талаалар, толтургучтар, чек ара боюнча баалуулуктарды "токтотууда чыккан" деп аталат.

Серепчинин демейки боюнча Note

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

Margins жана толтургучтар үчүн нормалдашуусу баалуулуктар

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

* {Margin: 0; толтургучтар: 0; }

Бул CSS эреже +, же базалык мүнөзгө колдонот. Бул мүнөзү ал тышкы салынган эмес, анткени бул эреже, абдан бүдөмүк да 0. запастарын жана толтургуч "бардык элементтерди", ал, негизинен, ар бир HTML элемент тандап, жолго чыгышчу дегенди билдирет, ал демейки серепчиден караганда жогорку өзгөчөлүккө ээ болот баалуулуктар болот. Ошол демейки үстүнө жазууга кандай болгондуктан, бул бир стили эмне жөнөйбүз нерсени ишке ашырат.

Дагы бир параметр HTML жана дене элементтерине бул баалуулуктарды колдонуу болуп саналат. Сиздин беттеги бардык башка элементтер бул эки элементтин балдар болот, анткени, CSS каскады бул баалуулуктарды бардык башка элементтер колдонуу керек.

HTML, дене {margin: 0; толтургучтар: 0; }

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

Borders

Балким, сен: "Бирок, эч кандай браузерлер демейки боюнча орган элементке бир чек жок", ойдо болушу мүмкүн. Бул толугу менен туура эмес. Internet Explorer улгайган котормолорунда элементтеринин тегерегинде ачык же көзгө көрүнбөгөн чек жок. Сиз 0 чек башкача каралбаса, ошол чек ара Мүмкүн ашкана Сиздин бет катмарлары. Сиз IE бул азайган түрүн колдоо көрсөтүүнү уланта берет деген чечим кабыл алган болсо, дене жана HTML стилдеги төмөнкүлөрдү кошуп, бул маселени чечүү керек:

HTML, дене {
margin: 0px;
толтургучтар: 0px;
Чек ара: 0px;
}

Сиз чектерин жана толтургуч өчүрүлгөн кантип эле ушул жаңы стили да демейки чек өчүп калат. Ошондой эле мурунку макалада көрсөтүлгөндөй базалык селектор аркылуу да эч нерсе кыла алган эмес.

Атайга Krynin тарабынан Original макалада. Jeremy Джирард тарабынан 9/27/16 күнү өзгөртүлдү.