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" >