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