Style borderStyle özelliği

Tanım ve Kullanım

borderStyle Özellik, elementin çerçeve tarzını ayarlar veya döndürür.

Bu özellik bir ila dört değer alabilir：

  • Bir değer, örneğin：p {border-style: solid} - Tüm dört çerçeve dolu
  • İki değer, örneğin：p {border-style: solid dotted} - Üst ve alt çerçeveler keskin çizgili, sol ve sağ çerçeveler keskin çizgili
  • Üç değer, örneğin：p {border-style: solid dotted double} - Üst çerçeve keskin çizgili, sol ve sağ çerçeveler nokta çizgili, alt çerçeve çift çizgili
  • Dört değer, örneğin：p {border-style: solid dotted double dashed} - Üst çerçeve keskin çizgili, sağ çerçeve keskin çizgili, alt çerçeve çift çizgili, sol çerçeve keskin çizgili

Ayrıca bakınız：

CSS Eğitimi：CSS Kenarlık

CSS İpuçları Kılavuzu：border-style özelliği

HTML DOM İpuçları Kılavuzu：border özelliği

Örnek

Örnek 1

<div> elementine dolgu çerçeve ekleyin:

document.getElementById("myDiv").style.borderStyle = "solid";

Kişisel olarak deneyin

Örnek 2

<div> elementinin dört çerçevesinin tarzını değiştirin:

document.getElementById("myDiv").style.borderStyle = "dotted solid double dashed";

Kişisel olarak deneyin

Örnek 3

Dönüş <div> elementinin çerçeve tarzı:

alert(document.getElementById("myDiv").style.borderStyle);

Kişisel olarak deneyin

Örnek 4

Tüm farklı değerlerin gösterimi:

var listValue = selectTag.options[selectTag.selectedIndex].text;
document.getElementById("myDiv").style.borderStyle = listValue;

Kişisel olarak deneyin

Gramer

borderStyle özelliğini döndürün:

object.style.borderStyle

borderStyle özelliğini ayarlayın:

object.style.borderStyle = value
Değer Açıklama
none Sınırsız çerçeve tanımlar. Öntanımlı.
hidden "none" ile aynıdır, ancak tablo elementlerinin çerçeve çatışmalarını çözmek için istisna.
dotted Noktali çerçeve tanımlar.
dashed Dokumsuz çerçeve tanımlar.
solid Sıvı çerçeve tanımlar.
double İki sınırları tanımlar. İki çerçevenin genişliği border-width değerleriyle aynıdır.
groove 3D kazıntılı çerçeve tanımlar. Etki border-color değerleri.
ridge 3D çıkıntılı sınırları tanımlar. Etki border-color değerleri.
inset 3D inset çerçeve tanımlar. Etki border-color değerleri.
outset 3D outset çerçeve tanımlar. Etki border-color değerine bağlıdır.
initial Bu özelliği öntanımlı değerine ayarlar. Bakınız initial.
inherit Bu özelliği ebeveyn elementinden devralır. Bakınız inherit.

Teknik ayrıntılar

Öntanımlı değer: Yok
Dönüş değeri: Dizi, element çerçeve tarzını ifade eder.
CSS sürümü: CSS1

Tarayıcı destekler

Chrome Edge Firefox Safari Opera
Chrome Edge Firefox Safari Opera
Destek Destek Destek Destek Destek