Devdit
 

ขอบภาพโค้งมน มุมภาพโค้งมน ด้วย CSS

3.3K

ขอบภาพโค้งมน มุมภาพโค้งมน ด้วย CSS บทความนี้สอนใช้คำสั่ง border-radius ใช้สำหรับทำให้ขอบ หรือมุมของ elements ต่างๆ เช่น รูปภาพ, div, ปุ่มกด มีความโค้งมน สวยงามมากขึ้น สามารถเขียนโปรแกรมได้ดังนี้

 

ตัวอย่าง ขอบภาพโค้งมน มุมภาพโค้งมน ด้วย CSS

<style>
    .img_radius {
        border-radius: 8px;
    }
</style>
<img src="https://www.devdit.com/chmod/post/images/4820291.png" class="img_radius">

คำอธิบาย

ขอบภาพโค้งมน มุมภาพโค้งมน ด้วย CSS จากตัวอย่างสร้าง class ใน CSS ชื่อ img_radius พร้อมคำสั่ง border-radius: 8px หมายความว่ากำหนดให้ขอบทั้ง 4 โค้งมน มุมภาพโค้งมน ขนาด 8px

แก้ไข 2 ปีที่แล้ว
ชอบ
ลิ้งก์
แชร์
Devdit มีช่อง YouTube แล้ว
เราสร้างวิดีโอเกี่ยวกับเทคโนโลยี ทำตามง่ายๆ