Computer >> บทช่วยสอนคอมพิวเตอร์ >  >> การเขียนโปรแกรม >> HTML

คุณสมบัติ HTML DOM Style borderColor


คุณสมบัติ borderColor ใช้สำหรับตั้งค่าหรือรับสีขอบขององค์ประกอบ ใช้ borderColor จัดการสีแต่ละด้านของขอบได้ คือแต่ละด้านมีสีต่างกันได้

ไวยากรณ์ (Syntax)

object.style.borderColor = "color|transparent|initial|inherit"

ค่าที่ใช้ได้ (Values)

ลำดับ ค่าและคำอธิบาย
1 Color
ระบุสีขอบ
2 Transparent
ทำให้สีขอบโปร่งใส เนื้อหาข้างใต้มองเห็นได้
3 initial
ตั้งค่าคุณสมบัติให้เป็นค่าเริ่มต้น
4 inherit
สืบทอดคุณสมบัตินี้จากองค์ประกอบพาเรนต์

ตัวอย่าง (Example)

<!DOCTYPE html> <html> <head> <style> 
  #DIV1{ 
    width:100px; 
    height:100px; 
    border:solid 10px ; 
    border-color: limegreen crimson; 
    top: 10px; 
  } 
</style> 
<script> 
  function changeBorderColor(){ 
    document.getElementById("DIV1").style.borderColor="crimson limegreen"; 
    document.getElementById("Sample").innerHTML="The border colors are now reversed"; 
  } 
</script> </head> 
<body> 
<div id="DIV1"></div> 
<p>Reverse the above div border colors by clicking the below button</p> 
<button onclick="changeBorderColor()">Change Border Color</button> 
<p id="Sample"></p> 
</body> </html>

ผลลัพธ์ (Output)

ผลลัพธ์ที่ได้:

คุณสมบัติ HTML DOM Style borderColor

เมื่อคลิกปุ่ม COLLAPSE BORDER:

คุณสมบัติ HTML DOM Style borderColor