Свойство border-radius
CSS свойство border-radius используется для добавления закругленных границ к элементу:
Нормальная граница
Круглая граница
Более круглая граница
Самая круглая граница
p {
border: 2px solid red;
border-radius: 5px;
}
Попробуйте сами »
Еще примеры border
Все свойства верхней границы в одном объявлении
В этом примере показано сокращенное свойство для задания всех свойств верхней границы в одном объявлении.
Установите стиль нижней границы
В этом примере показано, как задать стиль нижней границы.
Установите ширину левой границы
В этом примере показано, как установить ширину левой границы.
Установите цвет четырех границ
В этом примере показано, как задать цвет четырех границ. Он может иметь от одного до четырех цветов.
Установите цвет правой границы
В этом примере показано, как задать цвет правой границы.
CSS Упражнения
Все CSS свойства border
| Свойство | Описание |
|---|---|
| border | Устанавливает все свойства границ в одном объявлении |
| border-bottom | Устанавливает все свойства нижней границы в одном объявлении |
| border-bottom-color | Задает цвет нижней границы |
| border-bottom-style | Задает стиль нижней границы |
| border-bottom-width | Задает ширину нижней границы |
| border-color | Задает цвет четырех границ |
| border-left | Устанавливает все свойства левой границы в одном объявлении |
| border-left-color | Задает цвет левой границы |
| border-left-style | Задает стиль левой границы |
| border-left-width | Задает ширину левой границы |
| border-radius | Устанавливает все четыре свойства border-*-radius для закругленных углов |
| border-right | Устанавливает все правые свойства границы в одном объявлении |
| border-right-color | Задает цвет правой границы |
| border-right-style | Задает стиль правой границы |
| border-right-width | Задает ширину правой границы |
| border-style | Задает стиль четырех границ |
| border-top | Устанавливает все свойства верхней границы в одном объявлении |
| border-top-color | Задает цвет верхней границы |
| border-top-style | Задает стиль верхней границы |
| border-top-width | Задает ширину верхней границы |
| border-width | Задает ширину четырех границ |