สไตล์borderWidth Property
ตัวอย่าง
เปลี่ยนความกว้างของเส้นขอบทั้งสี่ของ <div> องค์ประกอบ:
document.getElementById("myDiv").style.borderWidth = "thick";
ความหมายและการใช้งาน
คุณสมบัติ borderWidth ตั้งค่าหรือส่งคืนความกว้างของเส้นขอบขององค์ประกอบ
คุณสมบัตินี้สามารถรับค่าได้ตั้งแต่หนึ่งถึงสี่ค่า:
- ค่าเดียว เช่น p {border-width: thick} - ทั้งสี่เส้นขอบจะหนา
- สองค่า เช่น: p {border-width: thick thin} - ขอบบนและล่างจะหนา ขอบซ้ายและขวาจะบาง
- สามค่าเช่น: p {border-width: thick thin medium}- เส้นขอบด้านบนจะเป็นแบบหนา เส้นขอบด้านซ้ายและด้านขวาจะเป็นแบบบาง เส้นขอบด้านล่างจะเป็นแบบขนาดกลาง
- สี่ค่าเช่น: p {border-width: thick thin medium 10px} - เส้นขอบด้านบนจะเป็นแบบหนา เส้นขอบด้านขวาจะเป็นแบบบาง เส้นขอบด้านล่างจะเป็นแบบปานกลาง เส้นขอบด้านซ้ายจะเป็น 10px
รองรับเบราว์เซอร์
| Property | |||||
|---|---|---|---|---|---|
| borderWidth | Yes | Yes | Yes | Yes | Yes |
ไวยากรณ์
ส่งคืนคุณสมบัติ borderWidth:
object.style.borderWidth
ตั้งค่าคุณสมบัติ borderWidth:
object.style.borderWidth = "thin|medium|thick|length|initial|inherit"
มูลค่าทรัพย์สิน
| Value | Description |
|---|---|
| thin | Defines a thin border |
| medium | Defines a medium border. This is default |
| thick | Defines a thick border |
| length | The width of the border in length units |
| initial | Sets this property to its default value. Read about initial |
| inherit | Inherits this property from its parent element. Read about inherit |
รายละเอียดทางเทคนิค
| ค่าเริ่มต้น: | ปานกลาง |
|---|---|
| คืนมูลค่า: | สตริงที่แสดงถึงความกว้างของเส้นขอบขององค์ประกอบ |
| เวอร์ชัน CSS | CSS1 |
ตัวอย่างเพิ่มเติม
ตัวอย่าง
เปลี่ยนความกว้างของขอบด้านบนและด้านล่างเป็นหนา และขอบซ้ายและขวาเป็นบางของ <div> องค์ประกอบ:
document.getElementById("myDiv").style.borderWidth = "thick thin";
ตัวอย่าง
เปลี่ยนความกว้างของเส้นขอบทั้งสี่ของ <div> องค์ประกอบโดยใช้ ค่า ความยาว :
document.getElementById("myDiv").style.borderWidth = "1px 5px 10px 20px";
ตัวอย่าง
กลับความกว้างของเส้นขอบของ <div> องค์ประกอบ:
alert(document.getElementById("myDiv").style.borderWidth);
หน้าที่เกี่ยวข้อง
กวดวิชา CSS: CSS Border
การอ้างอิง CSS: คุณสมบัติ border-width
การอ้างอิง HTML DOM: คุณสมบัติเส้นขอบ
❮ สไตล์วัตถุ