Thuộc tính kích thước nội tuyến CSS
Ví dụ
Đặt kích thước của phần tử <div> theo hướng nội tuyến:
div {
inline-size: 200px;
}
Hãy tự mình thử »Thêm ví dụ "Hãy tự mình thử" bên dưới.
Định nghĩa và cách sử dụng
Thuộc tính inline-size
chỉ định kích thước của một phần tử theo hướng nội tuyến.
Lưu ý: writing-mode
thuộc tính CSS liên quan xác định hướng nội tuyến và điều này ảnh hưởng đến kết quả của thuộc tính inline-size
. Đối với các trang bằng tiếng Anh, hướng nội tuyến là từ trái sang phải và hướng khối là hướng xuống dưới.
Thuộc tính CSS inline-size
và block-size
rất giống với thuộc tính CSS width
và height
nhưng thuộc tính inline-size
và block-size
phụ thuộc vào hướng nội tuyến và khối.
Giá trị mặc định: | tự động |
---|---|
Thừa hưởng: | KHÔNG |
Hoạt hình: | Đúng. Đọc về hoạt hình Hãy thử nó |
Phiên bản: | CSS3 |
Cú pháp JavaScript: | đối tượng .style.inlineSize="250px" Hãy dùng thử |
Hỗ trợ trình duyệt
Các số trong bảng chỉ định phiên bản trình duyệt đầu tiên hỗ trợ đầy đủ thuộc tính.
Property | |||||
---|---|---|---|---|---|
inline-size | 57.0 | 79.0 | 41.0 | 12.1 | 44.0 |
Cú pháp CSS
inline-size: auto| value |initial|inherit;
Giá trị tài sản
Value | Description | Demo |
---|---|---|
auto | Default. The element's default inline-size value. | Demo ❯ |
length | Specifies the inline-size in px, pt, cm, etc. Negative values are allowed. Read about length units | Demo ❯ |
% | Specifies the inline-size in percent relative to size of parent element on the corresponding axis. | Demo ❯ |
initial | Sets this property to its default value. Read about initial | |
inherit | Inherits this property from its parent element. Read about inherit |
Thêm ví dụ
Ví dụ
Với giá trị thuộc tính writing-mode
của phần tử <div> được đặt thành Vertical-rl, hướng nội tuyến được thay đổi từ ngang sang hướng xuống và điều này ảnh hưởng đến cách hoạt động của thuộc tính inlie-size
:
div {
inline-size: 250px;
writing-mode: vertical-rl;
}
Hãy tự mình thử »Trang liên quan
Hướng dẫn CSS: Chiều cao và chiều rộng CSS
Hướng dẫn CSS: Mô hình CSS Box
Tham chiếu CSS: thuộc tính chiều cao
Tham chiếu CSS: thuộc tính chiều rộng
Tham khảo CSS: thuộc tính chế độ viết