margin
Misol
<div> elementining to‘rtala tashqi bo‘shliqini (margin) o‘rnating:
document.getElementById("myDiv").style.margin = "50px 10px 20px 30px";O‘zingiz sinab ko‘ring »
Tavsif
margin xususiyati elementning tashqi bo‘shliqlarini (margin) o‘rnatadi yoki qaytaradi.
Bu xususiyat birdan to‘rttagacha qiymat qabul qilishi mumkin:
- Bitta qiymat, masalan: div {margin: 50px} - to‘rtala tashqi bo‘shliq 50px bo‘ladi
- Ikkita qiymat, masalan: div {margin: 50px 10px} - yuqori va pastki tashqi bo‘shliqlar 50px, chap va o‘ng tashqi bo‘shliqlar 10px bo‘ladi
- Uchta qiymat, masalan: div {margin: 50px 10px 20px}- yuqori tashqi bo‘shliq 50px, chap va o‘ng tashqi bo‘shliq 10px, pastki tashqi bo‘shliq 20px bo‘ladi
- To‘rtta qiymat, masalan: div {margin: 50px 10px 20px 30px} - yuqori tashqi bo‘shliq 50px, o‘ng tashqi bo‘shliq 10px, pastki tashqi bo‘shliq 20px, chap tashqi bo‘shliq 30px bo‘ladi
margin xususiyati ham, padding xususiyati ham element atrofiga bo‘sh joy qo‘shadi. Biroq farq shundaki, margin bo‘sh joyni chegara atrofiga, padding esa element chegarasining ichiga qo‘shadi.
Brauzerlarda qo‘llab-quvvatlash
| Xususiyat | |||||
|---|---|---|---|---|---|
| margin | Ha | Ha | Ha | Ha | Ha |
Sintaksis
margin xususiyatini qaytarish:
object.style.margin
margin xususiyatini o‘rnatish:
object.style.margin = "%|length|auto|initial|inherit"
Xususiyat qiymatlari
| Qiymat | Tavsif |
|---|---|
| % | Tashqi bo‘shliqlarni ota element kengligiga nisbatan % da belgilaydi |
| length | Tashqi bo‘shliqlarni uzunlik birliklarida belgilaydi |
| auto | Tashqi bo‘shliqlarni brauzer o‘rnatadi (to‘rtala tashqi bo‘shliq teng bo‘ladi) |
| initial | Bu xususiyatni standart qiymatiga o‘rnatadi. initial haqida o‘qing |
| inherit | Bu xususiyatni ota elementidan meros qilib oladi. inherit haqida o‘qing |
Texnik tafsilotlar
| Standart qiymat: | 0 |
|---|---|
| Qaytariladigan qiymat: | Elementning tashqi bo‘shliqlarini ifodalovchi String |
| CSS versiyasi | CSS1 |
Ko‘proq misollar
Misol
<div> elementining to‘rtala tashqi bo‘shliqini "25px" ga o‘zgartiring:
document.getElementById("myDiv").style.margin = "25px";
O‘zingiz sinab ko‘ring »
Misol
<div> elementining tashqi bo‘shliqlarini qaytaring:
alert(document.getElementById("myDiv").style.margin);
O‘zingiz sinab ko‘ring »
Misol
margin xususiyati va padding xususiyati o‘rtasidagi farq:
function changeMargin() {
document.getElementById("myDiv").style.margin = "100px";
}
function changePadding() {
document.getElementById("myDiv2").style.padding = "100px";
}
O‘zingiz sinab ko‘ring »
Tegishli sahifalar
CSS darsligi: CSS margin
CSS ma’lumotnomasi: margin xususiyati
W3Schools Pathfinder
Yutuqlaringizni kuzating – bu bepul!