Useful shortcuts for vi editor

Friday, 25 March 2011

CSS’de Anchor Pseudo-sınıfları

CSS sınıfları oluştururken kullanılan Pseudo sınıflarının Anchor <a> etiketine ait olanlarının bazılarını inceleyeceğiz.
Öncelikle bir notepad veya başka metin programı ile aşağıdaki kodları yazıp, yazdığımız dosyayı .css uzantılı olarak farklı kaydedelim.

/* a etiketli psuedo kodları */
a:link {color:#FF0000}    /* ziyaret edilmeyen link */
a:visited {color:#00FF00} /* ziyaret edilmiş link */
a:hover {color:#FF00FF}   /* fare imleci üzerinde olan link */
a:active {color:#0000FF/* seçili link */

Şimdi bu yazdığımız css dosyasını web sitemizde nasıl kullanacağımıza bakalım. (dosyanın isminin ornek.css olarak kaydedildiğini ve link sayfasının baglanti.html olduğunu varsaydık.)


<!--html’de css dosyası kullanımı-->
<html>
 <head>
  <link rel="stylesheet" type="text/css" href="ornek.css" /> <!--css dosyasını sayfaya yükleme-->
</head>
 <body>
  <p>Sayın ziyaretçi, <a href="baglanti.html">Lütfen linke tıklayınız. </a></p> <!--link oluşturma-->
 </body>
</html>

Bu yazımızda CSS ile geliştirilen web sitelerinde sıkça kullanılan Anchor pseudo kodlarını inceledik. Sorularınız ve yorumlarınızı bekliyorum. Hepinize mutlu günler dilerim. J