Dış Çizgiler

Bir öğenin kenarlığını ve kenarlık yarıçapını hızla biçimlendirmek için bu classları kullanın. Resimler, butonlar veya başka herhangi bir öğe için kullanabilirsiniz.

Dış çizgi rengi#

.border-primary

.border-secondary

.border-white

.border-black

.border-gray

.border-light

.border-dark

.border-success

.border-info

.border-warning

.border-danger

Sass#

Aşağıdaki Sass işlevine ek olarak, renkler ve daha fazlası için dahil edilen CSS özel özelliklerimizi (diğer adıyla CSS değişkenleri) inceleyebilirsiniz.

Değişkenler#

$borderPrimary:     #fd6905;
$borderSecondary:   #dddddd;
$borderWhite:       #ffffff;
$borderBlack:       #000000;
$borderGray:        #a0a0a0;
$borderLight:       #f9f9f9;
$borderDarkGray:    #2c2a28;
$borderSuccess:     #44c61f;
$borderInfo:        #93d8dd;
$borderWarning:     #fcdf27;
$borderDanger:      #ff0000;

Dış çizgi#

Bir öğeye kenarlık ekleme, bir kenar hariç uygulama ve köşeleri yumuşatmak için kullanabileceğiniz önceden tanımlanmış class'lar mevcuttur.

<div class="border"></div>
<div class="border-top"></div>
<div class="border-end"></div>
<div class="border-bottom"></div>
<div class="border-start"></div>

Tümü veya bir kenar hariç dış çizgi#

<div class="border-0"></div>
<div class="border-right border-bottom border-left"></div>
<div class="border-top border-bottom border-left"></div>
<div class="border-top border-right border-left"></div>
<div class="border-top border-right border-bottom"></div>

Dış çizgi kalınlığı#

<div class="border border-1"></div>
<div class="border border-2"></div>
<div class="border border-3"></div>
<div class="border border-4"></div>
<div class="border border-5"></div>

Kenar yumuşatma#

<div class="border-round"></div>
<div class="border-rounded"></div>
<div class="border-circle"></div>