thuộc tính marginBottom

Định nghĩa và cách sử dụng

marginBottom thuộc tính thiết lập hoặc trả về khoảng cách dưới ngoài của phần tử.

Thuộc tính margin và Thuộc tính padding Tất cả đều chèn khoảng trống xung quanh phần tử. Nhưng khác nhau ở chỗ, margin chèn khoảng trống xung quanh viền, trong khi padding chèn khoảng trống trong viền của phần tử.

Xem thêm:

Hướng dẫn CSS:Cân cách CSS

Hướng dẫn CSS:Thuộc tính margin-bottom

Hướng dẫn HTML DOM:Thuộc tính margin

Mô hình

Ví dụ 1

Đặt khoảng cách dưới ngoài của phần tử <div>:

document.getElementById("myDiv").style.marginBottom = "50px";

Thử ngay

Ví dụ 2

Chuyển khoảng cách dưới ngoài của phần tử <div> về "normal":

document.getElementById("myDiv").style.marginBottom = "0px";

Thử ngay

Ví dụ 3

Trả về khoảng cách dưới ngoài của phần tử <div>:

alert(document.getElementById("myDiv").style.marginBottom);

Thử ngay

Ví dụ 4

Khoảng cách dưới ngoài marginBottom và paddingBottom khác nhau:

function changeMargin() {
  document.getElementById("myDiv").style.marginBottom = "100px";
}
function changePadding() {
  document.getElementById("myDiv2").style.paddingBottom = "100px";
}

Thử ngay

Cú pháp

Trả về thuộc tính marginBottom:

object.style.marginBottom

Đặt thuộc tính marginBottom:

object.style.marginBottom = "%|length|auto|initial|inherit"

Giá trị thuộc tính

Giá trị Mô tả
% Định nghĩa khoảng cách dưới ngoài bằng phần trăm chiều rộng của phần tử cha.
length Định nghĩa khoảng cách dưới ngoài bằng đơn vị độ dài.
auto Cài đặt khoảng cách dưới ngoài của trình duyệt.
initial Đặt thuộc tính này về giá trị mặc định. Xem thêm initial。
inherit Kế thừa thuộc tính này từ phần tử cha. Xem thêm inherit。

Chi tiết kỹ thuật

Giá trị mặc định: 0
Giá trị trả về: Chuỗi, biểu thị khoảng cách dưới ngoài của phần tử.
Phiên bản CSS: CSS1

Hỗ trợ trình duyệt

Chrome Edge Firefox Safari Opera
Chrome Edge Firefox Safari Opera
Hỗ trợ Hỗ trợ Hỗ trợ Hỗ trợ Hỗ trợ