CSS приклад: border-bottom-right-radius

Опції

Значення за замовчуванням0
НаслідуєтьсяНі
Відсоткове значенняТак, відносно ширини блоку
ЗастосовуєтьсяДо всіх елементів
Посилання на специфікаціюhttp://www.w3.org/TR/css3-background/#border-bottom-right-radius

Версії CSS

CSS 1CSS 2CSS 2.1CSS 3

Опис

Встановлює радіус закруглення правого нижнього кута рамки. Якщо рамка не задана, то закруглення також відбувається і з фоном.

Синтаксис

border-bottom-right-radius: [значення | відсотки] [значення | відсотки]

Значення

Як радіус вказується будь-яке припустиме значення в CSS (px, cm, in, em та ін.), а також відсотки, у цьому випадку радіус закруглення розглядається від ширини блоку.

Додаткове друге значення призначене для створення еліптичного кутка, перше значення встановлює радіус по горизонталі, а друге – радіус по вертикалі.

Приклад нижче показує, як створити різні типи кутків.

Результат цього прикладу показано на рисунку.

Браузери

Chrome до версії 4.0, Safari до версії 5.0, iOS використовують нестандартне властивість -webkit-border-top-left-radius.

Firefox до версії 4.0 використовує нестандартне властивість -moz-border-radius-topleft.

Часті запитання

  • Q: Як використовувати border-bottom-right-radius в CSS?

    A: Можна встановити значення властивості border-bottom-right-radius у CSS, вказавши радіус заокруглення для нижнього правого кута елемента.

  • Q: Де використовують border-bottom-right-radius в CSS?

    A: border-bottom-right-radius може бути використаний для створення заокруглених кутів у нижньому правому куті елемента, наприклад, у кнопках або блоках.

  • Q: Як задати конкретне значення border-bottom-right-radius в CSS?

    A: Значення border-bottom-right-radius можна вказати у пікселях, відсотках або інших одиницях виміру, наприклад, border-bottom-right-radius: 10px;

  • Q: Чи можна використовувати від'ємні значення для border-bottom-right-radius в CSS?

    A: Так, можна використовувати від'ємні значення для border-bottom-right-radius в CSS для створення вигнутих ефектів або перекривання сусідніх елементів.

  • Q: Чи підтримується властивість border-bottom-right-radius в усіх браузерах?

    A: Властивість border-bottom-right-radius підтримується у більшості сучасних браузерах, але можливі проблеми з сумісністю в старіших версіях Internet Explorer.