Thuộc tính CSS đệm-khối-bắt đầu
Thêm ví dụ "Hãy tự mình thử" bên dưới.
Định nghĩa và cách sử dụng
padding-block-start
của một phần tử là khoảng trống từ đường viền đến nội dung của nó, ở điểm bắt đầu theo hướng khối.
Các thuộc tính CSS padding-block
và padding-inline
rất giống với các thuộc tính CSS padding-top
, padding-bottom
, padding-left
và padding-right
, nhưng các thuộc tính padding-block
và padding-inline
phụ thuộc vào hướng khối và nội tuyến.
Lưu ý: writing-mode
tính CSS liên quan xác định hướng khối. Điều này ảnh hưởng đến vị trí bắt đầu và kết thúc của một khối cũng như kết quả của thuộc tính padding-block
. Đối với các trang bằng tiếng Anh, hướng khối là hướng xuống và hướng nội tuyến là từ trái sang phả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.paddingBlockStart="100px" 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 | |||||
---|---|---|---|---|---|
padding-block-start | 87.0 | 87.0 | 41.0 | 12.1 | 73.0 |
Cú pháp CSS
padding-block-start: auto| value |initial|inherit;
Giá trị tài sản
Value | Description | Demo |
---|---|---|
auto | Default. The element's default padding-block-start value. | Demo ❯ |
length | Specifies padding-block-start in px, pt, cm, etc. Negative values are not allowed. Read about length units | Demo ❯ |
% | Specifies padding-block-start in percent relative to size of parent element in the inline direction. | 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 writing-mode
của phần tử <div> được đặt thành rl dọc, hướng khối là từ phải sang trái. Kết quả là phần đầu của phần tử được di chuyển từ trên xuống bên phải:
div {
writing-mode: vertical-rl;
padding-block-start: 50px;
}
Hãy tự mình thử »Trang liên quan
Thuộc tính khối đệm CSS: Thuộc tính khối đệm CSS
Thuộc tính CSS Padding-block-end: Thuộc tính CSS Padding-block-end
Thuộc tính CSS Padding-bottom: Thuộc tính CSS Padding-bottom
Thuộc tính đệm nội tuyến CSS: CSS Padding-inline
Thuộc tính CSS Padding -left: CSS Padding-left
Thuộc tính CSS Padding-right: CSS Padding-right
Thuộc tính CSS Padding -top: CSS Padding-top
Thuộc tính chế độ viết CSS: Thuộc tính chế độ viết CSS