CSS รัศมีด้านซ้ายล่างของเขตติดขอบ

定义和用法

border-bottom-left-radius 属性定义左下角边框的形状。

提示:该属性允许您向元素添加圆角边框。

另请参阅:

CSS3 教程:CSS3 ขอบเขต

实例

向 div 元素的左下角添加圆角边框:

div
{
border:2px solid;
border-bottom-left-radius:2em;
}

亲自试一试

CSS 语法

border-bottom-left-radius: length|% [length|%

หมายเหตุ:ค่ายาวและสัดส่วนของ border-bottom-left-radius นิยามเส้นรีบร้อยวงกลมสี่เหลี่ยม (กำหนดรูปร่างของมุมของขอบเขตด้านนอก) ของเส้นรัศมี (radii)。ค่าแรกคือเส้นรัศมีระนักฐานะตามแนวนอนราบ และค่าที่สองคือเส้นรัศมีตามแนวตั้งตามสูงของตู้เขตเมื่อที่สองค่าหายไปจะคัดลอกค่าแรก หากค่ายาวเท่ากับศูนย์กลางเส้นรัศมีจะมีมุมเหลี่ยมแทนที่จะเป็นกลม สัดส่วนของเส้นรัศมีระนักฐานะอ้างอิงจากความกว้างของตู้เขตเมื่อสัดส่วนของเส้นรัศมีตามแนวตั้งอ้างอิงจากความสูงของตู้เขต。

ค่านิยาม

ค่า การอธิบาย การทดสอบ
length กำหนดรูปร่างของมุมล่างซ้าย。 การทดสอบ
% กำหนดรูปร่างของมุมล่างซ้ายด้วยสัดส่วนเปอร์เซ็นต์。 การทดสอบ

รายละเอียดเทคโนโลยี

ค่าเริ่มต้น: 0
การสืบทอด: no
รุ่น: CSS3
JavaScript การเขียน object.style.borderBottomLeftRadius="5px"

การสนับสนุนเว็บเบราเซอร์

ตัวเลขในตารางระบุรุ่นแรกของเว็บเบราเซอร์ที่สนับสนุนคุณสมบัตินี้อย่างเต็มที่。

ตัวเลขที่มี -webkit- หรือ -moz- ระบุตัวเลขของรุ่นแรกที่ใช้คำนำหน้า。

Chrome IE / Edge Firefox Safari Opera
5.0
4.0 -webkit-
9.0 4.0
3.0 -moz-
5.0
3.1 -webkit-
10.5