CSS3.0 Yeni Kros Simgeleri Fare İmleçleri (cursor)

CSS3.0 İle Birlikte Yeni Kros Simgeleri Eklenmiş Fakat Bunları Bazı Tarayıcılar Desteklemeybilir Yeni Olanları Yeşil Renkli Bir Kutu İle belirttim mevcut kullandıklarımızı renkleri gri bir renkler belirttim bu kutuların üstüne farenizin imlecini getirerek test edebilirsiniz bu imleçlere bakalım
Varsayılan Kros Simgeleri


(Auto) Yani otomatik kros simgesi gösterir link ise link simgesi yazı ise yazı simgesi çıkar
(Default) Yani Varsayılan Normal Fare Simgesi Yani çıkar
Kodlar:
#etiket {cursor: auto;}
#etiket {cursor: default;}


Link Ve Bekletme Simgeleri


(context-menu) *YENİ CSS3 le Birlikte Gelen Yeni Bir Kros Simgesi Olan bir Özellik Menülerde Kullanılan Bir Özellik (Şu an Tarayıcılar Desteklemeyebilir) *YENİ
(help) Yardım Simgesi
(Pointer) Bildiğimiz Link Simgesi
(wait) Yani Bekle Ok Kros Simgesi Olmadan Komple Bekle Simgesi
(progress) Komple Bekle Simgesinin Küçüğü Olan Ok ve bekleme simgesi *YENİ
Kodlar:
#etiket {cursor: context-menu;}
#etiket {cursor: help;}
#etiket {cursorointer;}
#etiket {cursor: wait;}
#etiket {cursor: progress;}

Seçim Kros Simgeleri


(cell) Exel Kullanan kişelere yabancı olmayan bu simge Yeni Gelmiş *YENİ
(Crosshair) Oyunlarda çokca rastladığımız + artı simgesi
(text) Yazılarımızda Gelen Alıştığımız Dikey Simge
(vertical-text) Yatayın Tam Tersi Olarak Diket yazı simgesi *YENİ
Kodlar:
#etiket {cursor: cell;}
#etiket {cursor: crosshair;}
#etiket {cursor: text;}
#etiket {cursor: vertical-text;}


Taşıma ve Kopyala


(alias) Kısayol Kros Simgesi *YENİ
(copy) Kopyala kors Simgesi *YENİ
(move) Taşı Kros Simgesi
(no-drop) Taşınamaz Kors Simgesi *YENİ
(not-allowed) - (no-drop) ile aynı simgeye ait sadece isimleri farklı izin verilmeyen Kors Simgesi *YENİ
Kodlar:
#etiket {cursor: alias;}
#etiket {cursor: copy;}
#etiket {cursor: move;}
#etiket {cursor: no-drop;}
#etiket {cursor: not-allowed;}

Boyutlandırma


(e-resize) Yatay Boyutlandırma 1
(n-resize) Dikey Boyutlandırma 1
(ne-resize) Çapraz Boyutlandırma 1
(nw-resize) Çapraz Boyutlandırma 1
(s-resize) Dikey Boyutlandırma 2
(se-resize) Çapraz Boyutlandırma 2
(sw-resize) Çapraz Boyutlandırma 2
(w-resize) Yatay Boyutlandırma 2
(ew-resize) Yatay Boyutlandırma 3 *YENİ
(ns-resize) Dikey Boyutlandırma 3 *YENİ
(nesw-resize) Çapraz Boyutlandırma 3 *YENİ
(nwse-resize) Çapraz Boyutlandırma 3 *YENİ
(col-resize) Yatay Sadece SOL a ve SAĞ Boyutlandırma
(row-resize) Dikey Sadece ÜST e ve ALT a Boyutlandırma
(all-scroll) SOL a SAĞ a ÜST e ve ALT a Boyutlandırma
Kodlar:
#etiket {cursor:e-resize;}
#etiket {cursor:n-resize;}
#etiket {cursor:ne-resize;}
#etiket {cursor:nw-resize;}
#etiket {cursor:s-resize;}
#etiket {cursor:se-resize;}
#etiket {cursor:sw-resize;}
#etiket {cursor:w-resize;}
#etiket {cursor:ew-resize;}
#etiket {cursor:ns-resize;}
#etiket {cursor:nesw-resize;}
#etiket {cursor:nwse-resize;}
#etiket {cursor:col-resize;}
#etiket {cursor:row-resize;}
#etiket {cursor:all-scroll;}

Kros Ekleme


CSS2.1 De çoğunuz biliyorsunuzdur kros eklemeyi yinede konumuz kros olduğu için anlatalım kros eklemek için kodumuzu yazalım

P { cursor : url("mything.cur"), url("second.csr"), text; }


Yukarıdaki kodumuzda ikitane URL görüyorsunuz ilk URL tarayıcı tarafından bulunamazsa yada bir şekilde acamaz ise ikinci URL deki krosumuzu açmaya çalışıyor onuda aynı şekilde destelemez ve açamazsa text olarak gösteriyor

CSS3.0 da ise durum fazla değişmiyor PNG desteği getirilmiş

p { cursor: url(hyper.cur), url(hyper.png), pointer; }