Thuộc tính border-block-end CSS

Trang trước border-block-color
Trang tiếp theo border-block-end-color

Khóa học khuyến nghị:

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

CSS border-block-end Thuộc tính này là viết tắt của các thuộc tính sau trong CSS: border-bottom,border-left,border-right và border-top Thuộc tính rất tương tự, nhưng border-block-end Thuộc tính này phụ thuộc vào hướng khối.

Lưu ý:Các thuộc tính CSS liên quan writing-mode Định nghĩa hướng khối. Điều này sẽ ảnh hưởng đến vị trí điểm bắt đầu và kết thúc của khối cũng như border-block-end Kết quả của thuộc tính. Đối với trang tiếng Anh, hướng in-line là từ trái sang phải, hướng khối là xuống.

Thực例

Ví dụ 1

Đặt độ rộng, màu và樣式 cho viền ở cuối hướng khối:

div {
  border-block-end: 10px solid pink;
}

Thử nghiệm trực tiếp

Ví dụ 2: Kết hợp thuộc tính writing-mode

Vị trí viền ở cuối hướng khối bị ảnh hưởng bởi writing-mode Ảnh hưởng của thuộc tính:

div {
  writing-mode: vertical-rl;
  border-block-end: dotted blue;
}

Thử nghiệm trực tiếp

Cú pháp CSS

border-block-end: border-block-end-width border-block-end-style border-block-end-color|initial|inherit;

Giá trị thuộc tính

Giá trị	Mô tả
border-block-end-width	Định nghĩa độ rộng viền ở cuối hướng khối của phần tử. Giá trị mặc định là "medium".
border-block-end-style	Định nghĩa樣式 viền ở cuối hướng khối của phần tử. Giá trị mặc định là "none".
border-block-end-color	Định nghĩa màu viền ở cuối hướng khối của phần tử. Giá trị mặc định là màu hiện tại của viền.
initial	Đặt thuộc tính này về giá trị mặc định. Xem thêm initial.
inherit	Thừa kế 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:	medium none currentcolor
Di truyền:	Không
Ch 制作 hoạt hình:	Hỗ trợ. Xem thêm:Thuộc tính liên quan đến hoạt hình.
Phiên bản:	CSS3
Cú pháp JavaScript:	object.style.borderBlockEnd="pink dotted 5px"