Радиус левого верхнего угла: border-top-left-radius

border-top-left-radius

Поддержка браузерами
Настольные браузеры Chrome Firefox Internet Explorer Opera Safari
Базовая поддержка, версии браузеров 4.0 4.0 9.0 10.5 5.0
Мобильные браузеры Android Firefox Mobile IE Phone Opera Mobile Safari Mobile
Базовая поддержка, версии браузеров 2.2 1.0 7 12.0 5.1.1
Свойство
border-top-left-radius — это свойство задает радиус левого верхнего угла границы элемента
Описание
Границы позволяют выделить текст из общего потока, придать ему особенное значение, украшают его
Наследование
Не наследуется. Это значит что стили применённые к родительскому элементу не передадутся потомкам
Применяется
Ко всем элементам кроме табличных
Может принимать значения
значение в абсолютных единицах | значение в относительных единицах | inherit
Значение по умолчанию
0
Правила записи

свойство: значение;


также есть возможность задавать овальные углы, для этого задаются два значения, первое значение указывает на горизонтальный радиус, а второе — на вертикальный радиус, синтаксис тогда примет вид:

свойство: значение значение;

  • значения перечисляются через пробел
  • порядок значений важен, первое значение задает радиус по горизонтали, второе — радиус по вертикали
Примеры

<p>

Радиус верхнего левого угла границы равняется 10px

</p>

<p>

Радиус верхнего левого угла границы равняется 2em

</p>

<p>

Радиус верхнего левого угла границы равняется 50% от размера контейнера

</p>

<p>

Радиус верхнего левого угла границы равняется 10px по горизонтали и 50px по вертикали

</p>

<p>

Радиус верхнего левого угла границы равняется 1.5em по горизонтали и 3em по вертикали

</p>

<p>

Радиус верхнего левого угла границы равняется 70% по горизонтали и 90% по вертикали

</p>

<p>

Это значит что свойство унаследует значение от родителя

</p>

Поделиться