: aktif - CSS Hileleri

Anonim

:activeSözde seçici bir bağlantı görünümünü aktive edilirken (tıkladım veya başka şekilde aktive edilir) değiştirir. Genellikle yalnızca bir an için görülür ve öğenin gerçekten tıklandığına dair görsel geri bildirim sağlar. Genellikle bağlantı bağlantılarında ( ) kullanılır.

Örneğin, aktif durumda bağlantı bağlantılarının bir piksel aşağıya inmesini sağlayacak (üç boyutlu uzayda itilmiş izlenimi veren) CSS'yi burada bulabilirsiniz:

CodePen'de CSS-Tricks Ekibi'nin (@ css-tricks) Kalem: etkin durumunu görün.

: Aktif, herhangi bir öğe için de geçerli olabilir. Aşağıdaki Kalemde, sayfanın herhangi bir yerine tıklamak tüm sayfayı sarı yapar:

CodePen'de CSS-Tricks Team (@ css-tricks) tarafından hazırlanan: active psuedo sınıfının Pen Demosuna bakın.

Özellikle bağlantılar için tüm "durumları" kapsamak en iyi uygulamadır. Bunu yapmanın kolay bir yolu "NEFRETİ SEVMEK" veya

L: bağlantı
O
V: ziyaret edilmiş
E

H: vurgulu
A: etkin
T
E

Bunları bu sırayla yapmak idealdir.

a:link ( /* Essentially means a(href), or that the link actually goes somewhere */ color: blue; ) a:visited ( color: purple; ) a:hover ( color: green; ) a:active ( color: red; )

Aksi takdirde, diyelim ki: en son ziyaret edilen stilini listelediyseniz, bu bağlantı ziyaret edildiyse: active ve: hover bildirimini geçersiz kılar ve bağlantı, fareyle üzerine gelip gelmediğinize veya bağlantının etkin olup olmadığına (ideal değil) bakılmaksızın her zaman mor olacaktır.

Tarayıcı Desteği

Krom Safari Firefox Opera IE Android iOS
Evet 2.0.4+ hiç 4+ 4+ TBD TBD