Маржа және толтыру
Маржа мен толтыру арасындағы айырмашылық CSS-тің маңызды аспектісі болып табылады, өйткені жиектер мен толтыру CSS-те әртүрлі элементтер арасындағы қашықтықты қамтамасыз ету үшін қолданылатын екі маңызды түсінік болып табылады. Толтырғыш пен жиектер бір-бірін алмастырмайды және әртүрлі мақсаттарға ие, сондықтан оларды дұрыс пайдалану керек. Толтырғыш - блоктың мазмұны мен шекарасы арасындағы кеңістік. Екінші жағынан, маржа блоктың шекарасынан тыс кеңістік болып табылады. Жиек блоктарды көрші блоктардан бөледі, ал толтыру шекараны мазмұннан бөледі.
Толтырғыш дегеніміз не?
CSS (Cascading Style Sheets) жүйесінде толтыру - мазмұн мен жиек арасындағы бос орын. Ол блоктың мазмұнын оның шетінен бөледі. Толтырғыш мөлдір және элементтің фондық суретін немесе өң түсін де қамтиды. Элемент толтыру мөлшері CSS кодындағы «толтыру» терминін қолдану арқылы анықталады. Мысалы, мазмұнның айналасына 25 пиксель толтыру қосу үшін келесі кодты пайдалануға болады.
div {
ені: 300px;
биіктігі: 300px;
толтыру: 25px;
шекара: 25px тұтас;
}
Қажет болса, әр түрлі толтыру мәндерін солға, оңға, үстіңгі және астыңғы жағы үшін бөлек көрсетуге болады. Келесі код бөлігі әр тарап үшін әртүрлі толтыру мәндерін көрсетеді.
div {
ені: 300px;
биіктігі: 300px;
толтырғыш: 25px;
төменгі толтыру: 35px;
сол жақ толтыру: 5px;
толтыру-оң жақ: 10px;
шекара: 25px тұтас;
}
Маржа дегеніміз не?
CSS (Cascading Style Sheets) ішінде жиек шекарадан тыс кеңістік болып табылады. Ол блокты басқа блоктардан бөледі. Маржа да мөлдір, бірақ толтырудан үлкен айырмашылық мынада, шетке элементке қолданылатын фондық кескіндер немесе өң түстері кірмейді. CSS-тегі маржа мөлшері «маржа» терминімен анықталады. Келесі код бөлігі div блогының айналасында 25 пиксель жиегін қолданды.
div {
ені: 320px;
биіктігі: 320px;
шек: 5px тұтас;
маржа: 25px;
}
Блоктың әртүрлі жақтары үшін де әртүрлі мәндерді көрсетуге болады. Келесі код бөлігі әр тарап үшін әртүрлі маржа мәндерін қолданады.
div {
ені: 320px;
биіктігі: 320px;
шек: 5px тұтас;
жоғарғы жиек: 25px;
төменгі жиек: 35px;
шет-сол: 5px;
оң жақ шет: 10px;
}
Маржа мен толтыру арасындағы айырмашылық неде?
• Толтыру - жиек пен мазмұн арасындағы бос орын, ал жиек - шекарадан тыс кеңістік.
• Толтыру блоктың мазмұнын жиектен бөледі. Маржа бір блокты екіншісінен бөледі.
• Толтырғыш мазмұнға қолданылатын фондық кескіндер мен фондық түстерден тұрады, ал жиекте мұндай мазмұн жоқ.
• Көрші блоктардың шеттері қабаттасуы мүмкін, ал толтыру қабаттаспайды.
Қорытынды:
Толтыру және маржа
Толтыру – шекараны мазмұннан бөлетін блок шекарасының ішіндегі кеңістік. Шет - блокты көрші блоктардан бөлетін шекараның сыртындағы аралық. Тағы бір айырмашылық мынада, толтыру мазмұнның айналасында қолданылатын фондық кескінді және өң түстерін қамтиды, ал жиекте оларды қамтымайды. Көрші блоктардың шеттері кейде браузер бетті көрсеткенде қабаттасуы мүмкін, бірақ толтыру үшін мұндай нәрсе болмайды.
