Skip to main content
อ่านเจอจากบล็อกของ pittaya เกี่ยวกับการสั่งขอบโค้ง (rounded corners) ที่เป็นคุณสมบัติใหม่ของ CSS เวอร์ชั่น 3 (ซึ่งตอนนี้สามารถใช้ได้กับ Mozilla/Firefox และ Safari) เพียงแค่ใส่คำสั่ง CSS เพิ่มเข้าไปก็จะได้ขอบโค้งสวยงาม คำสั่งที่ใช้เพิ่มเข้าไปใน div คือ -moz-border-radius: 5px; // สำหรับ Mozilla/Firefox -webkit-border-radius: 5px; // สำหรับ Safari หรือจะให้โค้งเฉพาะมุมใดมุมหนึ่งก็ได้ เช่น มุมบนซ้าย -moz-border-radius-topleft: 5px; // สำหรับ Mozilla/Firefox -webkit-border-top-left-radius: 5px; // สำหรับ Safari การสั่งให้แสดงผลแบบนี้จะไม่มีผลกับ Internet Explorer โดยจะแสดงเป็นมุมสี่เหลี่ยมตามปกติ ภาพตัวอย่างที่แสดงในเบราเซอร์ IE no rounded corners in ie ภาพตัวอย่างที่แสดงในเบราเซอร์  Mozilla/Firefox rounded corners work in firefox and safari