Sekilas Gosip Trik Menciptakan Border Warna-Warni Di Sajian Navigasi

Cara Membuat Border Warna-warni di Navigasi Menu ala Evo Magz - Ok pada postingan kali ini Blog Espada akan membahas bagaimana menciptakan border warna-warni, Buat anda yang pernah melihat template Evo Magz niscaya anda menemukan ada Istimewa dari sajian navigasinya, yap.., pada sajian navigasi pada Template Evo Magz memakai Border warna-warni, yang menciptakan sajian navigasi-nya terlihat lebih bagus dan cantik.

Cara tersebut juga saya gunakan pada template Blog saya ini, Berawal dari saya yang tertarik ingin menciptakan sajian navigasi menyerupai mirip Evo Magz, Namun tidak membuahkan hasil ketika membuatnya, itupun juga Googling dari di Internet, Kemudian saya berinisiatif untuk memasang bordernya saja pada template ini dan ternyata berhasil 100%.

Tertarik ingin menyebabkan Border Navigasi pada template blog anda menyerupai diatas, Jika tertarik silahkan ikuti tutorial dibawah ini, mungkin caranya agak ribet namun nanti sanggup anda sesuakian sendiri nantinya. OK Langsung aja

Cara Membuat Border Menu Navigasi ala Evo Magz

• Seperti biasa silahkan anda login ke akun blogger - Template - Edit HTML
• Jika sudah cari Kode sajian Navigasi, Code-nya kira-kira menyerupai dibawah ini!

#navitions{font:normal bold 14px Arial, sans-serif;background-repeat:repeat-x;background-position:Bottom center;border-bottom:0px solid #000}
#mobilenav{display:none}
#nav{height:50px;position:relative}
.menu,.menu *{margin:0;padding:0;list-style:none}
.menu li{position:relative}

• Kira-kira codenya menyerupai diatas, biasanya Kodenya berbeda-beda pada setiap template. Kalau kesulitan mencarinya silahkan cari aba-aba nav (Kode tersebut niscaya terdapat pada aba-aba Menu Navigasi)
• Jika sudah ketemu, Langkah selanjutnya ialah menambahkan Code border. Caranya silahkan Copy code CSS di Bawah ini dan paste di antara Kode Navigasi.
• Contohnya jikalau Code Menu navigasi anda menyerupai ini!

#navitions{background-color:#2C2C2C;border-bottom:0px solid #000}
#mobilenav{display:none}
#nav{height:50px;position:relative}

• Maka tinggal menambahkan aba-aba ini!

background-image:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjam8m3A9ZindWCbhUhueP75nTZtiYhNTUPeJvKwlGZADgKKTIjX5K74c0hoVqWr0H_pNvvz8V9HGLlQeohuDcKIme4LPP3gmS9vUHhS-WmRo7t5QgnBIqCZTYcB6ao0LNneVb7PqSDGdIJ/s1600/line.png); background-repeat:repeat-x;background-position:Bottom center; 

• Maka kesudahannya menyerupai di bawah ini!

#navitions{background-color:#2C2C2C;background-image:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjam8m3A9ZindWCbhUhueP75nTZtiYhNTUPeJvKwlGZADgKKTIjX5K74c0hoVqWr0H_pNvvz8V9HGLlQeohuDcKIme4LPP3gmS9vUHhS-WmRo7t5QgnBIqCZTYcB6ao0LNneVb7PqSDGdIJ/s1600/line.png);
background-repeat:repeat-x;background-position:Bottom center;border-bottom:0px solid #000}
#mobilenav{display:none}
#nav{height:50px;position:relative}

• Silahkan ganti bottom dengan Top jikalau ingin border ada di atas Navigasi
• Simpan Template dan Lihat hasilnnya, Biasanya border belum sesuai dengan Menu Navigasi di template anda.
• Untuk mengatasinya silahkan Ubah sedikit Ukuran navigasi anda, sanggup dikurangi maupun ditambah menyerupai ukuran 50px diatas dan sanggup anda sesuaikan sendiri
• Semoga berhasil

Demikian artikel perihal Cara menambah Border Warna-warni di Menu Navigasi, Sekian yang sanggup saya bagikan dan biar Berhasil.