SourceГраницы
Используйте утилиты для границ, чтобы быстро оформить границу и радиус границы элемента. Отлично подходит для изображений, кнопок или любого другого элемента.
Граница
Используйте утилиты границ, чтобы добавить или удалить границы элемента. Выбирайте из всех границ или по одной за раз.
добавка
Копировать
<span class= "border" ></span>
<span class= "border-top" ></span>
<span class= "border-right" ></span>
<span class= "border-bottom" ></span>
<span class= "border-left" ></span>
вычитающий
Копировать
<span class= "border-0" ></span>
<span class= "border-top-0" ></span>
<span class= "border-right-0" ></span>
<span class= "border-bottom-0" ></span>
<span class= "border-left-0" ></span>
Цвет границы
Измените цвет границы с помощью утилит, построенных на цветах нашей темы.
Копировать
<span class= "border border-primary" ></span>
<span class= "border border-secondary" ></span>
<span class= "border border-success" ></span>
<span class= "border border-danger" ></span>
<span class= "border border-warning" ></span>
<span class= "border border-info" ></span>
<span class= "border border-light" ></span>
<span class= "border border-dark" ></span>
<span class= "border border-white" ></span>
Радиус границы
Добавьте классы к элементу, чтобы легко скруглять его углы.
Example rounded image
75x75
Example top rounded image
75x75
Example right rounded image
75x75
Example bottom rounded image
75x75
Example left rounded image
75x75
Completely round image
75x75
Rounded pill image
150x75
Example non-rounded image (overrides rounding applied elsewhere)
75x75
Копировать
<img src= "..." alt= "..." class= "rounded" >
<img src= "..." alt= "..." class= "rounded-top" >
<img src= "..." alt= "..." class= "rounded-right" >
<img src= "..." alt= "..." class= "rounded-bottom" >
<img src= "..." alt= "..." class= "rounded-left" >
<img src= "..." alt= "..." class= "rounded-circle" >
<img src= "..." alt= "..." class= "rounded-pill" >
<img src= "..." alt= "..." class= "rounded-0" >