Thuộc tính border-inline-end của CSS

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

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

border-inline-end Thuộc tính là viết tắt của các thuộc tính sau:

border-inline-end-width(Chiều rộng cạnh kết thúc trong dòng)
border-inline-end-style(Kiểu cạnh kết thúc trong dòng)
border-inline-end-color(Màu cạnh kết thúc trong dòng)

CSS của border-inline-end Thuộc tính này tương ứng với border-bottom、border-left、border-right và border-top Thuộc tính rất tương tự, nhưng border-inline-end Thuộc tính phụ thuộc vào hướng trong dòng.

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

Mẫu

Ví dụ 1

Đặt độ rộng, màu và kiểu border ở cuối hướng nội:

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

Thử ngay

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

Vị trí cuối hướng nội của border bị ảnh hưởng bởi writing-mode Tác động của thuộc tính:

div {
  writing-mode: vertical-rl;
  border-inline-end: 5px solid blue;
}

Thử ngay

Ví dụ 3: Kết hợp thuộc tính direction

Vị trí cuối hướng nội của border bị ảnh hưởng bởi direction Tác động của thuộc tính:

div {
  direction: rtl;
  border-inline-end: 5px solid hotpink;
}

Thử ngay

Cú pháp CSS

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

Giá trị thuộc tính

Giá trị	Mô tả
border-inline-end-width	Định nghĩa độ rộng border ở cuối hướng nội của phần tử. Giá trị mặc định là "medium".
border-inline-end-style	Định nghĩa樣式 border ở cuối hướng nội của phần tử. Giá trị mặc định là "none".
border-inline-end-color	Định nghĩa màu border ở cuối hướng nội của phần tử. Giá trị mặc định là màu border hiện tại.

Giá trị

Mô tả

border-inline-end-width

Định nghĩa độ rộng border ở cuối hướng nội của phần tử.

Giá trị mặc định là "medium".

border-inline-end-style

Định nghĩa樣式 border ở cuối hướng nội của phần tử.

Giá trị mặc định là "none".

border-inline-end-color

Định nghĩa màu border ở cuối hướng nội của phần tử.

Giá trị mặc định là màu border hiện tại.

Chi tiết kỹ thuật

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.
Giá trị mặc định:	medium none currentcolor
Kế thừa:	Không
Tạo animation:	Hỗ trợ. Xem thêm:Các thuộc tính liên quan đến animation.
Phiên bản:	CSS3
Cú pháp JavaScript:	object.style.borderInlineEnd="pink dotted 5px"