CSS anahat stili Özellik
Örnek
Anahat için bir stil belirleyin:
div {outline-style: dotted;}
Aşağıda daha fazla "Kendiniz Deneyin" örnekleri.
Tanım ve Kullanım
Anahat, öğeyi "ön plana çıkarmak" için sınırların dışında öğelerin etrafına çizilen bir çizgidir.
Özellik outline-style
, bir anahat stilini belirtir.
Varsayılan değer: | Yok |
---|---|
Miras: | Hayır |
canlandırılabilir: | Hayır. Canlandırılabilir hakkında bilgi edinin |
Sürüm: | CSS2 |
JavaScript sözdizimi: | nesne .style.outlineStyle="kesik çizgili" |
İpuçları ve Notlar
Not: Ana hatlar sınırlardan farklıdır ! Kenarlığın aksine, anahat öğenin sınırının dışına çizilir ve diğer içerikle çakışabilir. Ayrıca ana hat, öğenin boyutlarının bir parçası DEĞİLDİR; öğenin toplam genişliği ve yüksekliği, anahattın genişliğinden etkilenmez.
Tarayıcı Desteği
Tablodaki sayılar, özelliği tam olarak destekleyen ilk tarayıcı sürümünü belirtir.
Property | |||||
---|---|---|---|---|---|
outline-style | 1.0 | 8.0 | 1.5 | 1.2 | 7.0 |
CSS Sözdizimi
outline-style: none|hidden|dotted|dashed|solid|double|groove|ridge|inset|outset|initial|inherit;
Mülk değerleri
Value | Description | Play it |
---|---|---|
none | Specifies no outline. This is default | |
hidden | Specifies a hidden outline | |
dotted | Specifies a dotted outline | |
dashed | Specifies a dashed outline | |
solid | Specifies a solid outline | |
double | Specifies a double outliner | |
groove | Specifies a 3D grooved outline. The effect depends on the outline-color value | |
ridge | Specifies a 3D ridged outline. The effect depends on the outline-color value | |
inset | Specifies a 3D inset outline. The effect depends on the outline-color value | |
outset | Specifies a 3D outset outline. The effect depends on the outline-color value | |
initial | Sets this property to its default value. Read about initial | |
inherit | Inherits this property from its parent element. Read about inherit |
Daha fazla örnek
Örnek
Kesikli bir taslak:
div {outline-style: dashed;}
Örnek
Sağlam bir taslak:
div {outline-style: solid;}
Örnek
Çift anahat:
div {outline-style: double;}
Örnek
Bir oluk anahattı:
div {
outline-style:
groove;
outline-color: coral;
outline-width: 7px;
}
Örnek
Bir sırt taslağı:
div {
outline-style:
ridge;
outline-color: coral;
outline-width: 7px;
}
Örnek
Bir ek anahat:
div {
outline-style:
inset;
outline-color: coral;
outline-width: 7px;
}
Örnek
Bir başlangıç taslağı:
div {
outline-style:
outset;
outline-color: coral;
outline-width: 7px;
}
Örnek
Farklı değerler kullanarak bir anahat stilini ayarlayın:
p.a {outline-style: dotted;}
p.b {outline-style: dashed;}
p.c {outline-style: solid;}
p.d {outline-style: double;}
p.e {outline-style: groove;}
p.f {outline-style: ridge;}
p.g {outline-style: inset;}
p.h {outline-style: outset;}
İlgili Sayfalar
CSS eğitimi: CSS Anahattı
CSS referansı: anahat özelliği
HTML DOM referansı: anahatStyle özelliği