Html ve Css ile Yan Menü Butonları Yapımı

Bugün Html ve Css kodları yazarak yan menü butonlarını nasıl yapabileceğimizi göstereceğim.

 ⇒  Tasarımımızda ikonlar için Fontawesome‘ı CDN olarak ekliyoruz.

Fontawesome’ın son sürümünü CDN olarak kullanabilmek için sitesinden kayıt olup sonrasında gerekli CDN kodunu alabiliyoruz.

Siz de kayıt olup sizin için oluşturulan CDN kodunu sayfanıza eklemelisiniz. 

Örneğimizin son hali aşağıdaki gibi olacak.

html-ve-css-ile-yan-menu-butonlari-yapimi-yi

Kodlarımızı yazarken Css özelliklerinden transition ve position gibi özellikleri kullanıyoruz. Bu özellikler ile ilgili eksikleriniz varsa aşağıdaki linklerden konu anlatımlarına bakabilirsiniz.

Css Transition Kullanımı

Css Position Kullanımı

Artık kodlarımızı yazmaya başlayabiliriz.

Html kodları

Css kodları

Umarım “Html ve Css ile Yan Menü Butonları Yapımı” başlıklı yazım sizin için faydalı olmuştur.

Şu yazılar da ilginizi çekebilir.

Html ve Css ile Sabit/Yapışkan Sosyal Medya Butonları Yapımı

Css ile Buton Yapımı (3d Buton, Yuvarlak Buton, Animasyonlu Buton vb..)

Yeni bir yazımda görüşmek üzere.

2 Yorum

  1. blank Deniz Derya Ozturk Haziran 7, 2020 Cevapla
    • blank admin Haziran 7, 2020

Yorum Yazın

650+ ABONE ARASINA KATIL

Adını ve E-Posta adresini yazarak Html, Css, Javascript, Jquery, Bootstrap, Web Tasarım, C#, Bilgisayar, Telefon, Android, Veri Güvenliği ve daha birçok alanda ders anlatımlarından ve uygulamalı örneklerden anında haberdar olabilirsin.

Abone olduğunuz için teşekkürler.

Birşeyler yanlış gitti.