Thuộc tính order CSS
Định nghĩa và cách sử dụng
Thuộc tính order quy định thứ tự của phần tử co giãn so với các phần tử co giãn khác trong cùng một khay.
Chú ý:Nếu phần tử không phải là phần tử co giãn, thuộc tính order không có hiệu lực.
Xem thêm:
Hướng dẫn tham khảo CSS:Thuộc tính flex
Hướng dẫn tham khảo CSS:Thuộc tính flex-basis
Hướng dẫn tham khảo CSS:Thuộc tính flex-direction
Hướng dẫn tham khảo CSS:Thuộc tính flex-flow
Hướng dẫn tham khảo CSS:Thuộc tính flex-grow
Hướng dẫn tham khảo CSS:Thuộc tính flex-shrink
Hướng dẫn tham khảo CSS:Thuộc tính flex-wrap
Hướng dẫn tham khảo CSS:Thuộc tính align-content
Hướng dẫn tham khảo CSS:Thuộc tính align-items
Hướng dẫn tham khảo CSS:Thuộc tính align-self
Hướng dẫn tham khảo HTML DOM:Thuộc tính order
Mô hình
Đặt thứ tự của các phần tử co giãn:
div#myRedDIV {order: 2;} div#myBlueDIV {order: 4;} div#myGreenDIV {order: 3;} div#myPinkDIV {order: 1;}
Cú pháp CSS
order: number|initial|inherit;
Giá trị thuộc tính
Giá trị | Mô tả |
---|---|
number | Giá trị mặc định là 0. Quy định thứ tự của các phần tử co giãn. |
initial | Đặt thuộc tính này về giá trị mặc định. Xem: initial. |
inherit | Gia công thuộc tính này từ phần tử cha. Xem: inherit. |
Chi tiết kỹ thuật
Giá trị mặc định: | 0 |
---|---|
Kế thừa: | no |
Chế tạo animation: | Hỗ trợ. Xem thuộc tính riêng. Xem:Các thuộc tính liên quan đến animation. |
Phiên bản: | CSS3 |
Cú pháp JavaScript: | object.style.order="2" |
Hỗ trợ trình duyệt
Số liệu trong bảng chỉ ra phiên bản trình duyệt đầu tiên hỗ trợ đầy đủ thuộc tính này.
Số liệu trong bảng chỉ ra phiên bản trình duyệt đầu tiên hỗ trợ đầy đủ thuộc tính này, theo quy định của số liệu trước -webkit- hoặc -moz-.
Chrome | IE / Edge | Firefox | Safari | Opera |
---|---|---|---|---|
29.0 21.0 -webkit- |
11.0 |
28.0 18.0 -moz- |
9.0 6.1 -webkit- |
17.0 |