CSS Kenarlık Tarafları
CSS Kenarlığı - Bireysel Taraflar
Önceki sayfalardaki örneklerden, her bir kenar için farklı bir sınır belirlemenin mümkün olduğunu gördünüz.
CSS'de, sınırların her birini (üst, sağ, alt ve sol) belirtmek için özellikler de vardır:
Örnek
p
{
border-top-style: dotted;
border-right-style: solid;
border-bottom-style: dotted;
border-left-style: solid;
}
Sonuç:
Different Border Styles
Yukarıdaki örnek, bununla aynı sonucu verir:
Örnek
p {
border-style: dotted solid;
}
İşte nasıl çalıştığı:
border-styleÖzelliğin dört değeri varsa :
- kenarlık stili: noktalı düz çift çizgili;
- üst kenarlık noktalı
- sağ kenarlık sağlam
- alt kenarlık çift
- sol kenar kesikli
border-styleÖzelliğin üç değeri varsa :
- kenarlık stili: noktalı düz çift;
- üst kenarlık noktalı
- sağ ve sol kenarlıklar sağlam
- alt kenarlık çift
border-styleÖzelliğin iki değeri varsa :
- kenarlık stili: noktalı düz;
- üst ve alt kenarlıklar noktalı
- sağ ve sol kenarlıklar sağlam
border-styleÖzelliğin bir değeri varsa :
- kenarlık stili: noktalı;
- dört sınırın tümü noktalı
Örnek
/* Four values */
p {
border-style: dotted solid double dashed;
}
/* Three
values */
p {
border-style: dotted solid double;
}
/* Two values */
p {
border-style: dotted solid;
}
/* One value */
p {
border-style: dotted;
}
Özellik border-styleyukarıdaki örnekte kullanılmıştır. border-width
Ancak, ve ile de çalışır
border-color.