English | 简体中文 | 繁體中文 | Русский язык | Français | Español | Português | Deutsch | 日本語 | 한국어 | Italiano | بالعربية
border-bottom-left-radius используется в CSS для установки стиля закругления нижнего левого угла элемента. Этот圆可以是 круг или эллипс, когда значение равно 0, то это обычный прямоугольный угол, и форма фона, будь то изображение или цвет, будет受到影响 этим свойством.
В таблице ниже приведено описание использования и истории версий этого свойства, а также синтаксис использования в скриптах JavaScript.
Значение по умолчанию: | 0 |
---|---|
Подходит для: | Все элементы |
Наследование: | Нет |
Анимируемо: | Да.См. также Анимационные свойства. |
Версия: | Новая функция CSS3 |
Синтаксис JavaScript: | objectobject.style.borderBottomRightRadius="3px" |
Внимание:border-bottom-left-radius даже если не определен край или его значение установлено в none, этот атрибут сделает 背景 элемента круглым.
Синтаксис этого свойства следующий:
border-bottom-left-radius: [ length | percentage ] 1 or 2 values | initial | inherit
Эта аббревиатура может принимать один или два значения, разделенных одним или двумя пробелами.
Опциональное второе значение длины определяет вертикальный радиус нижнего левого угла, поэтому форма угла будет четверть эллипса.
Если пропущено второе значение длины или оно равно второму значению длины, форма угла будет четверть круга. Если любое значение длины равно нулю, угол будет квадратом, а не закругленным.
Ниже приведен пример того, как использовать свойство border-bottom-left-radius.
div { border: 2px solid #f08080; border-bottom-left-radius: 20px; }Протестируйте и посмотрите‹/›
В таблице ниже описаны значения этого свойства.
Значение | Описание |
---|---|
length | Единицы измерения значения могут быть px, pt, cm, em и т.д., но значения не могут быть отрицательными. |
percentage | Размер радиуса в процентах. В случае двух значений, первое значение percentages относительны ширины элемента рамки (горизонтальный радиус), а второе значение percentages относительны высоты элемента рамки (вертикальный радиус). Негативные значения не допускаются. |
initial | Установите это свойство в его значение по умолчанию. |
inherit | Если указан, то связанный элемент принимает значение border-bottom-left-radius свойств родительского элемента. |
Совместимость браузеров для свойств border-bottom-left-radius, числа в таблице представляют собой минимальную версию браузера, поддерживающего это свойство, все основные браузеры поддерживают это свойство.
|
Предупреждение: Internet Explorer 8 и более ранние версии не поддерживают CSS-свойство border-bottom-left-radius. Поддерживается в IE9 и более поздних версиях.
См. также учебник:CSS Border,CSS3 Border.
Связанные свойства:border-radius,border-bottom-right-radius,border-top-left-radius,border-top-right-radius.