กรอบสี่เหลี่ยม HTML วิธีสร้างกรอบด้วยคำสั่ง CSS

กรอบสี่เหลี่ยม HTML วิธีสร้างกรอบด้วยคำสั่ง CSS บทความนี้สอนการใช้คำสั่งของภาษา CSS เพื่อสร้างกรอบสี่เหลี่ยมขนาดต่างๆ ตามที่ต้องการโดยใช้คำสั่ง CSS เขียนที่แท็ก style ของ div สามารถเขียนโปรแกรมได้ดังนี้

ตัวอย่าง กรอบสี่เหลี่ยม HTML วิธีสร้างกรอบด้วยคำสั่ง CSS

<style>
    .box {
        width: 120px;
        height: 140px;
        background-color: antiquewhite;
        border: solid 4px darkcyan;
    }
</style>

<div class="box">กรอบรูป</div>

กรอบสี่เหลี่ยม HTML จากตัวอย่างโค้ดสร้าง class ชื่อ box ของ CSS พร้อมกำหนดคำสั่ง และนำไปใช้งานดังนี้

1. width กับ height คือคำสั่งกำหนดความกว้าง และสูงของกรอบสี่เหลี่ยม

2. background-color คือคำสั่งใส่สีพื้นหลังของกรอบสี่เหลี่ยม

3. border คือคำสั่งใส่เส้นขอบให้กับกรอบสี่เหลี่ยม