Button

Sadece Css kullanılarak hazırlanmış olan bu buton örnekleri 3D görünümde tıklanabilir özelliğe sahip.  Kullanımı  oldukça  kolay ve  isterseniz  örneklere seçili (active diye  yazılmış css  içinde ) sınıfını  atayarak hangi butonların tıklanmış olduğunuda  belirleyebiliyorsunuz. Active özelliği; ziyaretçinin tıkladığı  butonun veya incelediği  sayfanın tıklanmış bir şekilde  durmasını  sağlayan özelliktir.

Daha önceleri buna benzer türkçe içeriklerde  paylaşmıştık hatırlarsanız. Daha  çok ziyaretçinin hangi kategoriyi incelediğini  unutmaması  için kullanılan bir özelliktir. Geliştirici  adını  bir  türlü bulamadım malesef. Buton örnekleri Cssflow sitesi tarafından  hazırlanmış olup  mit lisansı altında yayınlanıyor.  Bu  demek oluyorki buton örneklerini dilediğiniz  gibi kullanabilirsiniz. Ben yaptım da diyebilirsiniz  ama biraz emeğe  saygı  göstermekte  fayda  var. Source  sayfasından download  adresine ulaşabilirsiniz.

 

Kullanım

  • Head etiketleri arasına eklemeniz gereken bölüm.

Css dosya url adresi : 

  <link rel="stylesheet" href="css/style.css">
  •  Body etiketleri arasına eklemeniz  gereken bölüm.

Html : 

  <section class="container">
    <a href="index.html" class="button">Start</a>
	<a href="index.html" class="button button-green">Start</a>
	<a href="index.html" class="button button-red">Start</a><br>
	<a href="index.html" class="button hover">Start</a>
	<a href="index.html" class="button button-green hover">Start</a>
	<a href="index.html" class="button button-red hover">Start</a><br>
	<a href="index.html" class="button active">Start</a>
	<a href="index.html" class="button button-green active">Start</a>
	<a href="index.html" class="button button-red active">Start</a>
  </section>

 

Bu Yazıyı Paylaş

Bir cevap yazın

E-posta hesabınız yayımlanmayacak. Gerekli alanlar * ile işaretlenmişlerdir

ÜYE GİRİŞİ

Arkadaş ekleme, özel mesaj, kişisel yazı paylaşmak için siteye giriş yapın

Şifremi unuttum? Kayıt Ol!
  • Ali:

    Pardon Yuyyu olacaktı...

  • Ali:

    Tamam yuyu da olsun :)...

  • Arkadaşlık Uygulaması:

    Yuyyu Online Arkadaşlık Sitesi – Sohbet Et ve Yeni İnsanlarla Tanış Yuy...

  • Ali:

    Üşenmeden web arşivi linkini arayıp bulmuşsun teşekkürler :)...

  • ibrahim:

    türkiyeden de bırakan olmuş oyunu. dünya geneli de bırakan epey olmuş. wi...

  • Araç çubuğuna atla