Marja va Padding
Chet va toʻldirish oʻrtasidagi farq CSS-da muhim jihatdir, chunki chekka va toʻldirish CSS-da turli elementlar orasidagi masofani taʼminlash uchun ishlatiladigan ikkita muhim tushunchadir. To'ldirish va chekkalar bir-birini almashtirib bo'lmaydi va turli maqsadlarga ega, shuning uchun ularni to'g'ri ishlatish kerak. To'ldirish - bu tarkib va blok chegarasi orasidagi bo'shliq. Boshqa tomondan, chekka blok chegarasidan tashqaridagi bo'shliqdir. Chegara bloklarni qo‘shni bloklardan ajratadi, to‘ldirish esa chegarani kontentdan ajratadi.
Padding nima?
CSS (Cascading Style Sheets) da toʻldirish bu kontent va chegara oʻrtasidagi boʻshliqdir. U blokning mazmunini uning chetidan ajratib turadi. Toʻldirish shaffof boʻlib, elementning fon tasviri yoki fon rangini ham oʻz ichiga oladi. Elementni to'ldirish miqdori CSS kodidagi "to'ldirish" atamasi yordamida aniqlanadi. Masalan, kontent atrofiga 25px hajm qoʻshish uchun quyidagi koddan foydalanish mumkin.
div {
kengligi: 300px;
balandligi: 300px;
toʻldirish: 25px;
chegara: 25px qattiq;
}
Agar kerak bo'lsa, chap, o'ng, yuqori va pastki uchun turli xil to'ldirish qiymatlari alohida belgilanishi mumkin. Quyidagi kod qismi har bir tomon uchun turli xil to‘ldirish qiymatlarini belgilaydi.
div {
kengligi: 300px;
balandligi: 300px;
toʻldiruvchi: 25px;
pastki qism: 35px;
toʻldirish-chap: 5px;
toʻldirish-oʻng: 10px;
chegara: 25px qattiq;
}
Marja nima?
CSS (Cascading Style Sheets) da marja chegaradan tashqaridagi bo'shliqdir. U blokni boshqa bloklardan ajratib turadi. Chegara ham shaffof, lekin toʻldirishdan katta farq shundaki, chekka elementga qoʻllaniladigan fon tasvirlari yoki fon ranglarini oʻz ichiga olmaydi. CSS-dagi marja miqdori "marja" atamasi yordamida belgilanadi. Quyidagi kod qismi div bloki atrofida 25px chegara qo'lladi.
div {
kengligi: 320px;
balandligi: 320px;
chegara: 5px qattiq;
chet: 25px;
}
Blokning turli tomonlari uchun ham turli qiymatlarni belgilash mumkin. Quyidagi kod qismi har bir tomon uchun turli chekka qiymatlarni qo'llaydi.
div {
kengligi: 320px;
balandligi: 320px;
chegara: 5px qattiq;
chetning tepasi: 25px;
pastki chet: 35px;
chek-chap: 5px;
chet-oʻng: 10px;
}
Margin va Padding oʻrtasidagi farq nima?
• Toʻldirish chegara va kontent oʻrtasidagi boʻshliq, cheti esa chegaradan tashqaridagi boʻsh joy.
• Toʻldirish blok tarkibini chegaradan ajratib turadi. Chegara bir blokni boshqasidan ajratib turadi.
• Toʻldirish kontentga qoʻllaniladigan fon tasvirlari va fon ranglaridan iborat boʻlib, chetida bunday tarkib yoʻq.
• Qoʻshni bloklarning chekkalari bir-biriga oʻxshab qolishi mumkin, toʻldirish esa bir-biriga oʻxshamaydi.
Xulosa:
Padding va Margin
Toʻldirish - bu chegarani kontentdan ajratib turuvchi blok chegarasi ichidagi boʻsh joy. Chegara - bu blokni qo'shni bloklardan ajratib turadigan chegara tashqarisidagi oraliq. Yana bir farq shundaki, to'ldirish tarkibiga fon tasviri va kontent atrofida qo'llaniladigan fon ranglari kiradi, chetida esa ularni o'z ichiga olmaydi. Brauzer sahifani ko'rsatganda, qo'shni bloklarning chegaralari ba'zan bir-biriga mos kelishi mumkin, ammo to'ldirish uchun bunday narsa bo'lmaydi.
