Border-style, bir HTML elementinin sınırının nasıl görüneceğini belirlemek için kullanılan bir CSS özelliğidir. Bu özellik, birden fazla seçenek sunar ve sınırın nasıl görüneceği tamamen tasarımcının tercihine bağlıdır.
Border-style seçenekleri şunlardır:
1. none: Sınır yok.
```css
border-style: none;
```
2. dotted: Noktalı bir sınır.
```css
border-style: dotted;
```
3. dashed: Kesikli bir sınır.
```css
border-style: dashed;
```
4. solid: Düz bir sınır.
```css
border-style: solid;
```
5. double: İki çizgili bir sınır.
```css
border-style: double;
```
6. groove: Yarım çember şeklinde bir sınır.
```css
border-style: groove;
```
7. ridge: Dışbükey görünümlü bir sınır.
```css
border-style: ridge;
```
8. inset: Basılı bir görünüm sağlayan bir sınır.
```css
border-style: inset;
```
9. outset: Kabartılmış bir sınır.
```css
border-style: outset;
```
Örnek kodlar:
```css
/* 1px dotted black sınır */
border-style: dotted;
border-width: 1px;
border-color: black;
/* 2px solid red sınır */
border-style: solid;
border-width: 2px;
border-color: red;
/* Yarım çember şeklinde sınır */
border-style: groove;
border-width: 5px;
border-color: blue;
/* Basılı görünüm sağlayan sınır */
border-style: inset;
border-width: 3px;
border-color: green;
```
Bu örnek kodlar, elementin sınırını farklı şekillerde işaretler ve renkler kullanarak belirler. Tasarım ihtiyaçlarına bağlı olarak, Border-style özelliğinde belirtilen seçeneklerden birini veya birkaçını kullanmak mümkündür.