คุณสมบัติ CSS outline-style รูปแบบเส้นขอบนอก

คุณสมบัติ outline-style ระบุรูปแบบของเส้นที่ล้อมรอบอีเลเมนต์ สามารถรับค่าได้ดังนี้:

• none - ไม่มีเส้นขอบ (เทียบเท่า outline-width:0;)
• solid - เส้นขอบนอกเป็นเส้นทึบเดี่ยว
• dotted - เส้นขอบนอกเป็นชุดของจุด
• dashed - เส้นขอบนอกเป็นชุดของเส้นสั้น
• double - เส้นขอบนอกเป็นสองเส้นทึบ
• groove - เส้นขอบนอกดูเหมือนขุดเข้าไปในหน้า
• ridge - เส้นขอบนอกดูตรงข้ามกับ groove
• inset - เส้นขอบนอกทำให้กล่องดูเหมือนฝังอยู่ในหน้า
• outset - เส้นขอบนอกทำให้กล่องดูเหมือนลอยออกมาจากผืนผ้าใบ
• hidden - เหมือน none

ตัวอย่าง

ลองรันโค้ดต่อไปนี้เพื่อนำคุณสมบัติ outline-style ไปใช้:

<html>    <head>    </head>    <body>       <p style = "outline-width:thin; outline-style:solid;">          ข้อความนี้มีเส้นขอบนอกบางทึบ       </p>       <br />       <p style = "outline-width:thick; outline-style:dashed;">          ข้อความนี้มีเส้นขอบนอกหนาขีด       </p>       <br />       <p style = "outline-width:5px;outline-style:dotted;">          ข้อความนี้มีเส้นขอบนอก 5px จุด       </p>    </body> </html>