Thu gọn lề CSS
Đôi khi hai lề thu gọn thành một lề duy nhất.
Thu gọn lề
Lề trên và lề dưới của các phần tử đôi khi được thu gọn thành một lề duy nhất bằng với lề lớn nhất của hai lề.
Điều này không xảy ra ở lề trái và phải! Chỉ có lề trên và dưới!
Hãy xem ví dụ sau:
Ví dụ
Trình diễn sự sụp đổ ký quỹ:
h1 {
margin: 0 0 50px 0;
}
h2 {
margin: 20px 0 0 0;
}
Hãy tự mình thử »Trong ví dụ trên, phần tử <h1> có lề dưới là 50px và phần tử <h2> có lề trên được đặt thành 20px.
Thông thường dường như gợi ý rằng lề dọc giữa <h1> và <h2> sẽ có tổng cộng 70px (50px + 20px). Nhưng do thu gọn lề nên lề thực tế sẽ là 50px.
Tất cả thuộc tính lề CSS
Property | Description |
---|---|
margin | A shorthand property for setting all the margin properties in one declaration |
margin-bottom | Sets the bottom margin of an element |
margin-left | Sets the left margin of an element |
margin-right | Sets the right margin of an element |
margin-top | Sets the top margin of an element |