Thuộc tính max-width CSS

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

max-width định nghĩa chiều rộng tối đa của phần tử.

Giải thích

Giá trị thuộc tính này sẽ đặt một giới hạn tối đa cho chiều rộng của phần tử. Do đó, phần tử có thể hẹp hơn giá trị được chỉ định, nhưng không thể rộng hơn. Không được phép chỉ định giá trị âm.

Xem thêm:

Hướng dẫn CSSKích thước CSS

Hướng dẫn CSSThuộc tính min-width CSS

Hướng dẫn HTML DOMThuộc tính maxWidth

Ví dụ

Đặt chiều rộng tối đa của đoạn văn:

p
  {
  max-width:100px;
  }

Thử ngay

Ngôn ngữ CSS

max-width: none|length|initial|inherit;

Giá trị thuộc tính

Giá trị Mô tả
none Mặc định. Định nghĩa không có giới hạn chiều rộng tối đa cho phần tử.
length Định nghĩa giá trị chiều rộng tối đa của phần tử.
% Định nghĩa chiều rộng tối đa dựa trên phần tử khối chứa nó.
inherit Định nghĩa rằng max-width nên kế thừa giá trị từ phần tử cha.

Chi tiết kỹ thuật

Giá trị mặc định: none
Kế thừa: no
Phiên bản: CSS2
Ngôn ngữ JavaScript: object.style.maxWidth="50px"

TIY Thực hành

Sử dụng giá trị pixel để đặt chiều rộng tối đa của phần tử
Ví dụ này minh họa cách sử dụng giá trị pixel để đặt chiều cao tối đa của phần tử.
Sử dụng phần trăm để đặt chiều rộng tối đa của phần tử
Ví dụ này minh họa cách sử dụng phần trăm để đặt chiều cao tối đa của phần tử.

Hỗ trợ trình duyệt

Số trong bảng chú thích phiên bản trình duyệt đầu tiên hỗ trợ thuộc tính này hoàn toàn.

Chrome IE / Edge Firefox Safari Opera
1.0 7.0 1.0 1.0 7.0