CSS :active Seçicisi

:active Seçicisi

Aktif linkin stilini tanımlamak için kullanılır.

Versiyon: CSS1

Note: Aktif link sadece bağlantılar için kullanılır.

Örnek

a:active { color: red;}

Codepen Ön izleme

See the Pen <a href="http://codepen.io/w3tr/pen/bEgjry/">CSS :active Seçici</a> by W3TR (<a href="http://codepen.io/w3tr">@w3tr</a>) on <a href="http://codepen.io">CodePen</a>.

Tarayıcı Desteği


4.0	2.0	7.0	3.1	9.6

Posted on 4 Ocak 20169 Ocak 2016 by Samed GÖZÜTOK 0

CSS3 [attribute*=value] Seçicisi

[attribute*=value] Seçicisi

Belirtilen değeri taşıyan tüm elementleri seçer.

Versiyon: CSS3

Örnek

span[class*="w3tr"] {
  display:block;
  font-size: 40px;
  color: blue;
}

Codepen Ön izleme

See the Pen <a href="http://codepen.io/w3tr/pen/dGNjNZ/">[attribute*=value] Seçici</a> by W3TR (<a href="http://codepen.io/w3tr">@w3tr</a>) on <a href="http://codepen.io">CodePen</a>.

Tarayıcı Desteği


4.0	3.5	7.0	3.2	9.6

Posted on 4 Ocak 20169 Ocak 2016 by Samed GÖZÜTOK 0

CSS [attribute|=value] Seçicisi

[attribute|=value] Seçicisi

Belirtilen değerden başlayarak belirtilen niteliği taşıyan elementlerin tamamını seçer.

Versiyon: CSS2

Örnek

span[lang|=en] {
  display: block;
  color: red;
  font-size: 40px;
}

Codepen Ön izleme

See the Pen <a href="http://codepen.io/w3tr/pen/EPZgXe/">[attribute|=value] Seçici</a> by W3TR (<a href="http://codepen.io/w3tr">@w3tr</a>) on <a href="http://codepen.io">CodePen</a>.

Tarayıcı Desteği


4.0	2.0	7.0	3.1	9.6

Posted on 2 Ocak 20169 Ocak 2016 by Samed GÖZÜTOK 0

CSS [attribute~=value] Seçicisi

[attribute~=value] Seçicisi

Belirli bir kelimeyi içeren elementleri seçmek için kullanılır.

Versiyon:CSS2

Örnek

span[title~=w3tr]{
  display:block;
  font-size: 30px;
  color: blue;
}

Codepen Ön izleme

See the Pen <a href="http://codepen.io/w3tr/pen/JGERWe/">[attribute~=value] Seçici</a> by W3TR (<a href="http://codepen.io/w3tr">@w3tr</a>) on <a href="http://codepen.io">CodePen</a>.

Tarayıcı Desteği


4.0	2.0	7.0	3.1	9.6

Posted on 2 Ocak 20169 Ocak 2016 by Samed GÖZÜTOK 0

CSS [attribute=value] Seçicisi

[attribute=value] Seçicisi

Belirtilen öznitelik ve değere göre element seçer.

Versiyon:CSS2

Örnek

a[target=_blank] {
  display: block;
  font-size:30px;
  color:red;
}

Codepen Ön izleme

See the Pen <a href="http://codepen.io/w3tr/pen/LGxRxq/">[attribute=value] Seçici</a> by W3TR (<a href="http://codepen.io/w3tr">@w3tr</a>) on <a href="http://codepen.io">CodePen</a>.

Tarayıcı Desteği


4.0	2.0	7.0	3.1	9.6

Posted on 2 Ocak 20169 Ocak 2016 by Samed GÖZÜTOK 0

CSS [attribute] Seçicisi

[attribute] Seçicisi

Öznitelikleri ile elementleri seçmek için kullanılır.

Versiyon:CSS2

Örnek

a[target] {
  background: blue;
  color: white;
  font-size: 20px;
}

Codepen Ön izleme

See the Pen <a href="http://codepen.io/w3tr/pen/wMgzoG/">[attribute] Seçici</a> by W3TR (<a href="http://codepen.io/w3tr">@w3tr</a>) on <a href="http://codepen.io">CodePen</a>.

Tarayıcı Desteği


4.0	2.0	7.0	3.1	9.6

Posted on 2 Ocak 20169 Ocak 2016 by Samed GÖZÜTOK 0

CSS3 element1~element2 Seçicisi

element1 ~ element2 Seçicisi

Element1 den sonra tekrar eden tüm element2 lere özellik atamak için kullanılır.

Versiyon:CSS3

Örnek

p ~ span {
  background: red;
  display:block;
}

Codepen Ön izleme

See the Pen <a href="http://codepen.io/w3tr/pen/VePKjN/">element1~element2 Seçici</a> by W3TR (<a href="http://codepen.io/w3tr">@w3tr</a>) on <a href="http://codepen.io">CodePen</a>.

Tarayıcı Desteği


EVET	EVET	7.0	EVET	EVET

Posted on 2 Ocak 20169 Ocak 2016 by Samed GÖZÜTOK 0

CSS element+element Seçicisi

Elementten sonra gelen ilk elemente özellik atamak için kullanılır.

Versiyon:CSS2

Örnek

div + span {
  color:red;
}

Codepen Ön izleme

See the Pen <a href="http://codepen.io/w3tr/pen/yegaOX/">element+element Seçici</a> by W3TR (<a href="http://codepen.io/w3tr">@w3tr</a>) on <a href="http://codepen.io">CodePen</a>.

Tarayıcı Desteği


EVET	EVET	7.0	EVET	EVET

Posted on 2 Ocak 20169 Ocak 2016 by Samed GÖZÜTOK 0

CSS element>element Seçicisi

element>element Seçicisi

Belirli bir element içindeki ebeveyn elementleri seçmek için kullanılır.

VERSİYON: CSS2

Örnek

div > span {
  color: red;
}

Codepen Ön izleme

See the Pen <a href="http://codepen.io/w3tr/pen/PZbveR/">element>element Seçici</a> by W3TR (<a href="http://codepen.io/w3tr">@w3tr</a>) on <a href="http://codepen.io">CodePen</a>.

Tarayıcı Desteği


EVET	EVET	7.0	EVET	EVET

Posted on 31 Aralık 20159 Ocak 2016 by Samed GÖZÜTOK 0

CSS element element Seçicisi

element element Seçicisi

Element içindeki başka bir elemente özellik atamak için kullanılır.

VERSİYON: CSS1

Örnek

div span {
  color: blue;
}

Codepen Ön izleme

See the Pen <a href="http://codepen.io/w3tr/pen/KVNLQE/">element element Seçici</a> by W3TR (<a href="http://codepen.io/w3tr">@w3tr</a>) on <a href="http://codepen.io">CodePen</a>.

Tarayıcı Desteği


EVET	EVET	EVET	EVET	EVET

Posted on 31 Aralık 20159 Ocak 2016 by Samed GÖZÜTOK 0

HTML, CSS

:active Seçicisi

Örnek

Codepen Ön izleme

Tarayıcı Desteği

[attribute*=value] Seçicisi

Örnek

Codepen Ön izleme

Tarayıcı Desteği

[attribute|=value] Seçicisi

Örnek

Codepen Ön izleme

Tarayıcı Desteği

[attribute~=value] Seçicisi

Örnek

Codepen Ön izleme

Tarayıcı Desteği

[attribute=value] Seçicisi

Örnek

Codepen Ön izleme

Tarayıcı Desteği

[attribute] Seçicisi

Örnek

Codepen Ön izleme

Tarayıcı Desteği

element1 ~ element2 Seçicisi

Örnek

Codepen Ön izleme

Tarayıcı Desteği

CSS element+element Seçicisi

Örnek

Codepen Ön izleme

Tarayıcı Desteği

element>element Seçicisi

Örnek

Codepen Ön izleme

Tarayıcı Desteği

element element Seçicisi

Örnek

Codepen Ön izleme

Tarayıcı Desteği