Главная/ Cправочник HTML, CSS, Javascript/ CSS справочник/ Свойства CSS для улучшения дизайна сайта/ CSS свойство border-top-right-radius | назначение, допустимые значения, примеры

Свойство border-top-right-radius

Последнее обновление: 04.05.2011

Свойство border-top-right-radius — задает радиус скругления правого верхнего угла элемента.

Допустимые значения

  • — точное значение радиуса (не может быть отрицательным)
  • — значение радиуса в процентах.

Есть возможность задать эллиптические радиусы используя пробел. Значение до пробела — радиус по оси х, а после пробела — радиус по оси у.

иллюстрация показывающая эллиптический радиус
эллиптический радиус

Если значения указаны в процентах, то значение радиуса по оси х отсчитывается в процентах от ширины блока, а значение радиуса по оси у — от высоты блока.

Значение по умолчанию 0
Применимо ко всем элементам, кроме табличных элементов для которых свойство border-collapse имеет значение ‘collapse’.
Наследование нет
Версия CSS CSS 3
Поддерживается браузерами
  • Internet Explorer 9 и выше
  • Firefox 4 и выше
  • Opera 10.5 и выше
  • Safari 5 и выше
  • Chrome 5 и выше

Пример


.block {
width:100px;
height:50px;
border-top-right-radius: 10px 20px;
border: 1px solid #000;
}


Твой код:

Результат: