Скругление границ блока в CSS
Сейчас мы научимся скруглять уголки
у блока. Для этого следует применять
свойство border-radius
, принимающее
значение в пикселях.
Что означает то, что мы указали скругление,
к примеру, в 10px
? Это радиус круга,
который можно вписать в это скругление. Если
у вас нелады с математикой и вам не понятно
последнее предложение - забудьте о нем и
просто подбирайте скругление на глаз. При
некотором опыте это сделать не проблема (измерительного
инструмента для измерения скруглений не существует,
по крайней мере я о таком не слышал).
Давайте скруглим уголки блоку, задав ему
скругление в 10px
:
<div id="elem"></div>
#elem {
width: 300px;
height: 100px;
border: 1px solid red;
border-radius: 10px;
}
:
Повторите страницу по данному образцу: