27 Şubat 2019

Blogger mobil uyumlu HTML menüler

Blogger kullanmanın en güzel taraflarından biriside, herhangi bir HTML5 kodu kopyala/yapıştır ile kullanabiliyor olmanız. Bende bu yazımda sizlerle mobil uyumlu blogger menü kodları paylaşacağım. Aşağıda paylaşacağım kodları ister tema içerisinde isterseniz de  HTML widget olarak da kullanabilirsiniz.

Kullanımı oldukça basit kodları kopyalayın/yapıştırın, isim ve linkleri düzenleyin ve bitti. Blogger mobil uyumlu menüler kullanıma hazır.


HTML5 Blogger mobil uyumlu menüler ve kodları



İndigo renkli blogger menü
<link rel="stylesheet" href="https://www.w3schools.com/w3css/4/w3.css">
<div class="w3-bar w3-indigo" style='sans-serif;'>
  <a href="#" class="w3-bar-item w3-button w3-border-right w3-hover-blue w3-mobile">Ana Sayfa</a>
  <a href="#" class="w3-bar-item w3-button w3-border-right w3-hover-blue w3-mobile">Hakkımda</a>
  <a href="#" class="w3-bar-item w3-button w3-border-right w3-hover-blue w3-mobile">iletişim</a>
  <a href="#" class="w3-bar-item w3-button w3-border-right w3-hover-blue w3-mobile">Sitemap</a>
</div>



Pembe renkli blogger menü
<link rel="stylesheet" href="https://www.w3schools.com/w3css/4/w3.css">
<div class="w3-bar w3-pink" style='sans-serif;'>
  <a href="#" class="w3-bar-item w3-button w3-border-right w3-hover-white w3-mobile">Ana Sayfa</a>
  <a href="#" class="w3-bar-item w3-button w3-border-right w3-hover-white w3-mobile">Hakkımda</a>
  <a href="#" class="w3-bar-item w3-button w3-border-right w3-hover-white w3-mobile">iletişim</a>
  <a href="#" class="w3-bar-item w3-button w3-border-right w3-hover-white w3-mobile">Sitemap</a>
</div>



Bej renkli blogger menü
<link rel="stylesheet" href="https://www.w3schools.com/w3css/4/w3.css">
<div class="w3-bar w3-sand" style='sans-serif;'>
  <a href="#" class="w3-bar-item w3-button w3-border-right w3-hover-white w3-mobile">Ana Sayfa</a>
  <a href="#" class="w3-bar-item w3-button w3-border-right w3-hover-white w3-mobile">Hakkımda</a>
  <a href="#" class="w3-bar-item w3-button w3-border-right w3-hover-white w3-mobile">iletişim</a>
  <a href="#" class="w3-bar-item w3-button w3-border-right w3-hover-white w3-mobile">Sitemap</a>
</div>



Yorumlar

0 yorum