CSS border-top-colorคุณสมบัติ
ตัวอย่าง
กำหนดสีสำหรับเส้นขอบด้านบน:
div {border-top-color: coral;}
ตัวอย่าง "ลองใช้เอง" เพิ่มเติมด้านล่าง
ความหมายและการใช้งาน
คุณสมบัติborder-top-color
กำหนดสีของเส้นขอบด้านบนขององค์ประกอบ
หมายเหตุ:ประกาศคุณสมบัติborder-styleหรือ
border-top-styleก่อนborder-top-color
คุณสมบัติเสมอ องค์ประกอบต้องมีเส้นขอบก่อนที่คุณจะเปลี่ยนสีได้
ค่าเริ่มต้น: | สีปัจจุบันขององค์ประกอบ |
---|---|
รับการถ่ายทอด: | ไม่ |
เคลื่อนไหวได้: | ใช่. อ่านเกี่ยวกับแอนิเมชั่น |
รุ่น: | CSS1 |
ไวยากรณ์ JavaScript: | วัตถุ .style.borderTopColor="blue" |
รองรับเบราว์เซอร์
ตัวเลขในตารางระบุเบราว์เซอร์รุ่นแรกที่สนับสนุนคุณสมบัติอย่างสมบูรณ์
Property | |||||
---|---|---|---|---|---|
border-top-color | 1.0 | 4.0 | 1.0 | 1.0 | 3.5 |
ไวยากรณ์ CSS
border-top-color: color|transparent|initial|inherit;
มูลค่าทรัพย์สิน
Value | Description | Play it |
---|---|---|
color | Specifies the color of the top border. Look at CSS Color Values for a complete list of possible color values. Default color is the current color of the element | |
transparent | Specifies that the border color should be transparent | |
initial | Sets this property to its default value. Read about initial | |
inherit | Inherits this property from its parent element. Read about inherit |
ตัวอย่างเพิ่มเติม
ตัวอย่าง
กำหนดสีสำหรับเส้นขอบด้านบนด้วยค่า HEX:
div {border-top-color: #92a8d1;}
ตัวอย่าง
กำหนดสีสำหรับเส้นขอบด้านบนด้วยค่า RGB:
div {border-top-color: rgb(201, 76, 76);}
ตัวอย่าง
กำหนดสีสำหรับเส้นขอบด้านบนด้วยค่า RGBA:
div {border-top-color: rgba(201, 76, 76, 0.3);}
ตัวอย่าง
กำหนดสีสำหรับเส้นขอบด้านบนด้วยค่า HSL:
div {border-top-color: hsl(89, 43%, 51%);}
ตัวอย่าง
กำหนดสีสำหรับเส้นขอบด้านบนด้วยค่า HSLA:
div {border-top-color: hsla(89, 43%, 51%, 0.3);}
ตัวอย่าง
กำหนดเส้นขอบด้านบนแบบโปร่งใส:
div {border-top-color: transparent;}
หน้าที่เกี่ยวข้อง
กวดวิชา CSS: CSS Border
การอ้างอิง CSS: border-top คุณสมบัติ
การอ้างอิง HTML DOM: borderTopColor คุณสมบัติ