การทำให้ขอบบล็อกโค้งมนใน CSS
ตอนนี้เราจะเรียนรู้วิธีการทำให้มุมของบล็อก
โค้งมน สำหรับสิ่งนี้ควรใช้
คุณสมบัติ border-radius ซึ่งรับค่า
เป็นพิกเซล
การที่เราระบุการทำให้โค้งมน
เช่น 10px หมายความว่าอย่างไร? นี่คือรัศมีของวงกลม
ที่สามารถเขียนในโค้งมนนี้ได้ ถ้า
คุณไม่ถนัดคณิตศาสตร์และไม่เข้าใจ
ประโยคสุดท้าย - ลืมมันไปและ
แค่ปรับค่าการโค้งมนด้วยสายตา
ด้วยประสบการณ์บางอย่าง การทำเช่นนี้ไม่ใช่ปัญหา (ไม่มี
เครื่องมือวัดสำหรับวัดค่าการโค้งมน
อย่างน้อยฉันก็ไม่เคยได้ยิน)
ลองทำให้มุมของบล็อกโค้งมน โดยกำหนด
การโค้งมนเป็น 10px:
<div id="elem"></div>
#elem {
width: 300px;
height: 100px;
border: 1px solid red;
border-radius: 10px;
}
:
ทำซ้ำหน้าตามตัวอย่างนี้:
