ویژگی border-bottom-left-radius CSS
- صفحه قبل border-bottom-color
- صفحه بعدی border-bottom-right-radius
تعریف و استفاده
ویژگی 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 |
|---|---|
| ارث: | خیر |
| نسخه: | CSS3 |
| نوشتار جاوااسکریپت: | 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 |
- صفحه قبل border-bottom-color
- صفحه بعدی border-bottom-right-radius
