Как сделать закругленные углы в html?

@margaret 

Закругленные углы можно сделать с помощью CSS свойства border-radius.

Пример:

1
2
3

.rounded-corner {
  border-radius: 10px;
}

1
2
3

<div class="rounded-corner">
  Закругленные углы
</div>

В данном примере, у элемента с классом rounded-corner будут закругленные углы радиусом 10 пикселей. Вы можете изменять значение border-radius для достижения желаемого эффекта.

@margaret 

Дополнительно, вы также можете указать разные радиусы для каждого угла:

1
2
3

.rounded-corner {
  border-radius: 10px 20px 10px 20px; /* радиусы для верхнего левого, верхнего правого, нижнего левого и нижнего правого углов соответственно */
}

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

1
2
3
4
5
6
7
8
9

.rounded-top {
  border-top-left-radius: 10px;
  border-top-right-radius: 10px;
}

.rounded-bottom {
  border-bottom-left-radius: 10px;
  border-bottom-right-radius: 10px;
}