4- Özellik Seçiciler(Attribute Selector)
Özellik seçiciler Xhtml taglarında kullanılan özelliklere yada bu özelliklerin aldıkları değerlere göre CSS kodlarını sayfa elemanlarına atamak için kullanılınır.
Dikkat ederseniz birbirinden farklı Xhtml tagları ama ikiside title özelliğini kullanmış burada title özelliğinin aldığı değer her iki Xhtml elemanı için muhakkak farklı olacaktır ama önemli olan bu iki elemanında title property(özelliğini) kullanmasıdır.
* Bu özellikler internet Explorer 7.0 altı sürümlerde desteklenmiyor……
özellik seçici oluşturalım ;
30 views
* (YILDIZ ) karakterini kullanarak genel bir seçici oluşturabilirsiniz ve bu tüm elemanlara uygulanacaktır.Ayrıca evrensel seçiciler belgedeki tüm elemanlara ugulanır.
Evrensel seçinin yapısı:
*{color:blue;text-decoration:overline;}
Örnek :
3 views
Css xhtml elemanlarının bir kutu içinde düşündüğünden , kutunun border yani kenarlık özelliklerini değiştirme imkanı sağlar.
Bu özellik kenar çizgisinin tipini ayarlamak için kullanılınır.Ayrıca kutu kenar çizgilerini kullanıma açmak için kullanılınır .Bu özelliğe atadığınız değer kutunun 4 kenarı içinde uygulanır.
| değer | açıklama |
| none | Herhangi bir border tanımlaması yok |
| hidden | Border gizle |
| dotted | Noktalı çizgi |
| dashed | Kesik çizgi şeklinde |
| solid | Tek çizgi |
| double | İki çizgi |
| groove | Oluk şeklinde çizgi |
| ridge | Üsten alta eğimli (sırtlı çizgi) |
| inset | İçe doğru derinlik hissi veren |
| outset | Dışa doğru derinlik hissi veren çizgi |
Burada şuna dikkat edelim bir p elemanı için kenarlık stili yani tipi tanımlaması yaptım çünkü p elemanı css tarafından bir kutu içerisindeymiş gibi varsayılır.
Örnek:
Resimin normal hali aşağıdadır ;
7 views
CSS kodlarının media türüne göre yazılması
Media özelliği ile oluşturmuş olduğumuz stil kodlarının hangi ortamda çalışacağını ayarlayabiliyorduk bu durumda CSS kodlarını media özelliğini kullanarak guruplara ayırıp web belgemizin içine yazabiliriz.
@media deyimi ;
İki gurup CSS kodu var @media screen kodları belge tarayıcıda izlenirken kullanılacak . @media print içindeki kod gurupları da sayfa yazıcıdan çıktı alınacağı zaman kullanılacak.
CSS dosyalarının media türüne göre sayfaya dahil edilmesi.
Dışarıdan ithal edilen CSS kodlarını media ile ortama göre gruplandırmak için;
@import url(ana.css) screen;
@import url(yazıcı.css) print ;
Yada <link> elemanı ile
<link rel=”stylesheets” type=”text/css” href=”ana.css” media=”screen” />
<link rel=”stylesheets” type=”text/css” href=”yazıcı.css” media=”print” />
Şeklinde yazmamız mümkün..
18 views
