Style borderWidth özelliği

Tanım ve Kullanım

borderWidth Özellik, elementin kenar çizgi genişliğini ayarlar veya döndürür.

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

  • Bir değer, örneğin: p {border-width: kalın} - Tüm dört kenar kalın
  • İki değer, örneğin: p {border-width: thick thin} - Üst ve alt çerçeveler kalın, sol ve sağ çerçeveler ince
  • Üç değer, örneğin: p {border-width: thick thin medium} - Üst çerçeve kalın, sol ve sağ çerçeve ince, alt çerçeve orta
  • Dört değer, örneğin: p {border-width: thick thin medium 10px} - Üst çerçeve kalın, sağ çerçeve ince, alt çerçeve orta, sol çerçeve 10px

Ayrıca bakınız:

CSS Eğitimi:CSS kenarlık

CSS Referans Kılavuzu:border-width özelliği

HTML DOM Referans Kılavuzu:border özelliği

Örnek

Örnek 1

<div> elementinin dört çerçevesinin genişliğini değiştirme:

document.getElementById("myDiv").style.borderWidth = "thick";

Kişisel olarak deneyin

Örnek 2

<div> elementinin yukarı ve aşağı çerçeve genişliğini kalın, sol ve sağ çerçeve genişliğini ince olarak değiştirme:

document.getElementById("myDiv").style.borderWidth = "thick thin";

Kişisel olarak deneyin

Örnek 3

<div> elementinin dört çerçevesinin genişliğini uzunluk değerleriyle değiştirme:

document.getElementById("myDiv").style.borderWidth = "1px 5px 10px 20px";

Kişisel olarak deneyin

Örnek 4

<div> elementinin çerçeve genişliğini döndürür:

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

Kişisel olarak deneyin

Gramer

borderWidth özelliğini döndürme:

object.style.borderWidth

borderWidth özelliğini ayarlama:

object.style.borderWidth = "thin|medium|thick|length|initial|inherit"
Değer Tanım
thin İnce çerçeveyi tanımlar.
orta Orta çerçeveyi tanımlar. Varsayılan.
thick Kalın çerçeveyi tanımlar.
length Uzunlukla ölçülen çerçeve genişliği.
initial Bu özelliği varsayılan değerine ayarlar. Bakınız initial
inherit Bu özelliği ebeveyn öğesinden miras alır. Bakınız inherit

Teknik ayrıntılar

Varsayılan değer: orta
Dönüş değeri: Dizi, element çerçevesinin genişliğini temsil eder.
CSS sürümü: CSS1

Tarayıcı desteği

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