Визначення та використання

Властивість border-radius визначає радіус кутів елемента.

Порада: Ця властивість дозволяє додати закруглені кути до елементів!

Ця властивість може мати від одного до чотирьох значень. Ось правила:

Чотири значення - border-radius: 15px 50px 30px 5px; (перше значення стосується верхнього лівого кута, друге значення стосується правого верхнього кута, третє значення стосується правого нижнього кута, а четверте значення стосується нижнього лівого кута):

Три значення - border-radius: 15px 50px 30px; (перше значення стосується верхнього лівого кута, друге значення стосується правого верхнього та нижнього лівого кутів, а третє значення стосується правого нижнього кута):

Два значення - border-radius: 15px 50px; (перше значення стосується верхнього лівого та нижнього правого кутів, а друге значення стосується правого верхнього та нижнього лівого кутів):

Одне значення - border-radius: 15px; (значення стосується всіх чотирьох кутів, які округлені однаково):