Bảng thời khóa biểu

Sách tham khảo CSS

Thuộc tính CSS

Khóa học tự chọn

Khuyến nghị khóa học:

Bao bì CodeW3C.com

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

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

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

border-inline-style Thuộc tính thiết lập biên dạng cạnh của phần tử trong hướng trong dòng.

border-inline-style Giá trị của thuộc tính có thể được thiết lập bằng nhiều cách:

Nếu border-inline-style Thuộc tính có hai giá trị:

border-inline-style: solid dotted;

Biên dạng của cạnh ở đầu dòng trong hướng trong dòng là đường thẳng (solid)
Biên dạng của cạnh ở cuối dòng trong hướng trong dòng là đường chấm (dotted)

Nếu border-inline-style Thuộc tính có một giá trị:

border-inline-style: dotted;

Biên dạng của cạnh ở đầu và cuối dòng trong hướng trong dòng đều là đường chấm (dotted)

CSS của border-inline-style Thuộc tính liên quan đến 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-style Thuộc tính phụ thuộc vào hướng trong dòng.

Lưu ý:các thuộc tính CSS liên quan writing-mode、text-orientation và direction Định nghĩa hướng trong 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-style Kết quả của thuộc tính. Đối với trang tiếng Anh, hướng trong dòng là từ trái sang phải, hướng khối là từ trên xuống.

Mẫu

Ví dụ 1

Đặt phong cách viền theo hướng trong dòng:

#example1 {
  border-inline-style: solid;
}
#example2 {
  border-inline-style: dashed dotted;
}

Thử nghiệm trực tiếp

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

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

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

Thử nghiệm trực tiếp

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

Vị trí của viền ở đầu và cuối hướng trong dòng bị ảnh hưởng bởi direction Tác động thuộc tính:

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

Thử nghiệm trực tiếp

Cú pháp CSS

border-inline-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. Đ指定无边框.
hidden	Tương tự như none, nhưng khác biệt trong việc giải quyết xung đột biên của phần tử bảng.
dotted	Đ指定点线边框.
dashed	Đ指定虚线边框.
solid	Đ指定实线边框.
double	Đ指定双线边框.
groove	Đ指定 3D边框凹槽. Hiệu ứng phụ thuộc vào giá trị của border-color.
ridge	Đ指定 3D边框凸起. Hiệu ứng phụ thuộc vào giá trị của border-color.
inset	Đ指定 3D边框内嵌. Hiệu ứng phụ thuộc vào giá trị của border-color.
outset	Đ指定 3D边框外凸. Hiệu ứng phụ thuộc vào giá trị của border-color.
initial	Đặt thuộc tính này thành giá trị mặc định. Xem thêm initial.
inherit	Kế thừa 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:Tính thuộc tính liên quan đến animation.
Phiên bản:	CSS3
Cú pháp JavaScript:	object.style.borderInlineStyle="dotted"