- Подробности
-
Категория: HTML, CSS
Синтаксис
Синтаксис у этого свойства следующий:
где X — радиус закругления. Измеряемый в пикселях.
Например:
Это самая простая запись. Так же можно записывать с двумя, тремя и четыремя параметрами. Первые два рассматривать не будем, а с четыремя рассмотрим поподробнее:
1
|
border-radius: X1 X2 X3 X4;
|
Где X1 радиус левого верхнего угла, а остальные идут по часовой стрелке, т.е. X2 — радиус правого верхнего угла и т.д.
Например:
1
|
border-radius: 4px 0 4px 0;
|
В данном случае мы закруглили левый верхний и правый нижний углы.
Овальное закругление
Для овального закругления, необходимо через слэш параметры.
Для записи с четыремя параметрами, это будет выглядеть так:
1
|
border-radius: 4px 0 4px 0 / 2px 0 2px 0;
|
Параметры до слэша, это радиус по горизонтали, а после — по вертикали.
Для записи с одним: