Thuộc tính border-inline-start-style CSS

trang trước border-inline-start-color
Trang tiếp theo border-inline-start-width

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

border-inline-start-style Định nghĩa và cách sử dụng để thiết lập樣式 viền cho phần tử bắt đầu từ hướng nội bộ.

Thuộc tính của CSS border-inline-start-style Thuộc tính với border-bottom-style、border-left-style、border-right-style và border-top-style Thuộc tính rất tương tự, nhưng border-inline-start-style Thuộc tính phụ thuộc vào hướng nội bộ.

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

Mẫu

Ví dụ 1

Đặt kiểu cho cạnh viền bắt đầu của hướng nội dòng:

div {
  border-inline-start-style: dotted;
}

Thử nghiệm ngay

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

Vị trí cạnh viền bắt đầu của hướng nội dòng bị ảnh hưởng bởi writing-mode Tác động của thuộc tính:

div {
  writing-mode: vertical-rl;
  border-inline-start-style: dotted;
}

Thử nghiệm ngay

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

Vị trí cạnh viền bắt đầu và kết thúc của hướng nội dòng bị ảnh hưởng bởi direction Tác động của thuộc tính:

div {
  direction: rtl;
  border-inline-start-style: dotted;
}

Thử nghiệm ngay

Cú pháp CSS

border-inline-start-style: none|hidden|dotted|dashed|solid|double|groove|ridge|inset|outset|initial|inherit;

Giá trị thuộc tính

Giá trị	Mô tả
none	Giá trị mặc định. Đ指定 không có cạnh viền.
hidden	Cùng với none, nhưng khác nhau trong việc giải quyết xung đột cạnh viền của phần tử bảng.
dotted	Đ指定 cạnh viền chấm
dashed	Đ指定 cạnh viền chấm
solid	Đ指定 cạnh viền thẳng
double	Đ指定 cạnh viền kép
groove	Đ指定 3D cạnh rãnh Hiệu ứng phụ thuộc vào giá trị của border-color.
rigde	Đ指定 3D cạnh nổi Hiệu ứng phụ thuộc vào giá trị của border-color.
inset	Đ指定 3D cạnh chìm Hiệu ứng phụ thuộc vào giá trị của border-color.
outset	Đ指定 3D cạnh nổi Hiệu ứng phụ thuộc vào giá trị của border-color.
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:	none
Kế thừa:	Không
Tạo animation:	Không hỗ trợ. Xem thêm:Thuộc tính liên quan đến animation.
Phiên bản:	CSS3
Cú pháp JavaScript:	object.style.borderInlineStartStyle="dotted"