Ирмэг(margins) нь аливаа тодорхойлсон хүрээний гадна элементүүдийн эргэн тойрон дахь орон зайг бий болгоход ашиглагддаг.
CSS Margins #
CSS margin шинж чанар нь аливаа тодорхойлсон хүрээний гадна элементүүдийн эргэн тойрон дахь орон зайг бий болгоход ашиглагддаг.
CSS -ийн тусламжтайгаар та ирмэгийг бүрэн хянах боломжтой болно. Элементийн тал бүрийн ирмэгийг (дээд, баруун, доод, зүүн) тохируулах шинж чанарууд байдаг.
Margin – Individual Sides #
CSS нь элементийн тал бүрийн ирмэгийг тодорхойлох шинж чанар юм.
margin-topmargin-rightmargin-bottommargin-left
Бүх маржингийн шинж чанарууд дараахь утгуудтай байж болно.
- авто – хөтөч нь маржинг тооцоолно
- урт- ирмэгийг px, pt, cm гэх мэтээр тодорхойлно.
- %- агуулсан элементийн өргөний % -ийн ирмэгийг зааж өгнө
- өвлөх – маржин нь эх элементээс өвлөгдөх ёстойг зааж өгнө
Зөвлөгөө: Сөрөг утгыг зөвшөөрдөг.
Элементийн дөрвөн талд өөр өөр ирмэгийг тохируулна уу:
p {
margin-top: 100px;
margin-bottom: 100px;
margin-right: 150px;
margin-left: 80px;
} Margin – Shorthand Property #
Кодыг богиносгохын тулд маржингийн бүх шинж чанарыг нэг шинж чанарт зааж өгөх боломжтой.
margin хөрөнгө нь дараахь хувийн үл хөдлөх хөрөнгийн богино хэмжээний өмч юм.
margin-topmargin-rightmargin-bottommargin-left
So, here is how it works:
If the margin property has four values:
- margin: 25px 50px 75px 100px;
- top margin is 25px
- right margin is 50px
- bottom margin is 75px
- left margin is 100px
#
Use the margin shorthand property with four values:
p {
margin: 25px 50px 75px 100px;
} if the margin property has three values:
- margin: 25px 50px 75px;
- top margin is 25px
- right and left margins are 50px
- bottom margin is 75px
#
Use the margin shorthand property with three values:
p {
margin: 25px 50px 75px;
} If the margin property has two values:
- margin: 25px 50px;
- top and bottom margins are 25px
- right and left margins are 50px
#
Use the margin shorthand property with two values:
p {
margin: 25px 50px;
} If the margin property has one value:
- margin: 25px;
- all four margins are 25px
#
Use the margin shorthand property with one value
p {
margin: 25px;
} div {
width: 300px;
margin: auto;
border: 1px solid red;
} div {
border: 1px solid red;
margin-left: 100px;
}
p.ex1 {
margin-left: inherit;
} 
