Как сделать так, чтобы у блока были закруглённые углы?

Question

Для того чтобы сделать у изображения или элемента закругленные углы, используется CSS-свойство border-radius. Значение указывается в пикселях, процентах или других единицах, определяя, насколько закругленными будут углы.

Например, border-radius: 10px создаст закругленные углы с радиусом 10 пикселей.

YeaHub · Accepted Answer

Свойство border-radius в CSS позволяет задавать радиус скругления углов элемента. Чем больше значение, тем сильнее закругляются углы. Это свойство можно использовать как для квадратных, так и для прямоугольных элементов, включая изображения, кнопки, блоки и другие HTML-элементы.Закругление всех углов одинаково: Указав одно значение, можно задать радиус для всех углов сразу, например, border-radius: 15px закруглит все углы элемента на 15 пикселей.Закругление отдельных углов: Можно задать разные значения для каждого угла, например, border-radius: 10px 20px 30px 40px, где значения идут в порядке: верхний левый, верхний правый, нижний правый, нижний левый.Процентное закругление: Если использовать процентные значения, например, border-radius: 50%, это создаст полностью круглую форму у элемента, если его ширина и высота равны.Свойство border-radius позволяет легко создавать современные интерфейсы с мягкими границами и скругленными элементами.