Để đặt kiểu viền, hãy sử dụng thuộc tính border-style. Thuộc tính border-style cho phép bạn chọn một trong các kiểu viền sau:
- none: Không có viền
- solid: Viền là một đường liền đơn.
- dotted: Viền là một loạt các chấm.
- dashed: Viền là một loạt các đường ngắn.
- double: Viền là hai đường liền.
- groove: Viền trông như thể được khắc vào trang.
- ridge: Viền trông ngược với groove.
- inset: Viền làm hộp trông như được nhúng vào trang.
- outset: Viền làm hộp trông như nổi ra khỏi canvas.
- hidden: Giống none, trừ việc giải quyết xung đột viền cho các phần tử bảng.
Ví dụ
Bạn có thể chạy mã sau để đặt kiểu viền:
<html> <head> </head> <body>. <p style = "border-width:4px; border-style:none;"> Đây là viền không có độ rộng. </p> <p style = "border-width:4px; border-style:solid;"> Đây là viền nét liền. </p> <p style = "border-width:4px; border-style:dashed;"> Đây là viền nét đứt. </p> <p style = "border-width:4px; border-style:double;"> Đây là viền đôi. </p> <p style = "border-width:4px; border-style:groove;"> Đây là viền groove. </p> </body> </html>