Как сделать скругление в css

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

.rounded {
  border-radius: 10px; /* радиус скругления углов в 10 пикселей */
}

Этот код сделает элемент с классом .rounded с закругленными углами, радиус которых составляет 10 пикселей.

Также можно задавать скругление для каждого отдельного угла, используя четыре значения свойства border-radius (для левого-верхнего, правого-верхнего, правого-нижнего, левого-нижнего углов):

.rounded {
  border-top-left-radius: 10px;
  border-top-right-radius: 20px;
  border-bottom-right-radius: 15px;
  border-bottom-left-radius: 5px;
}

Этот код задаст элементу с классом .rounded скругление каждого угла в отдельности.

Свойство border-radius также может использоваться для создания круговых элементов, задавая значение радиуса, равное половине ширины или высоты элемента. Например:

.circle {
  width: 100px;
  height: 100px;
  border-radius: 50%;
}

Этот код создаст элемент с классом .circle, который будет исполнен в форме круга.