Ayo Belajar HTML CSS | Membuat Header Menu Keren #1

A.Pendahuluan
Assalamu’alaikum Wr.Wb. Hay gays kembali lagi di blog sederhana saya , pada kesempatan kali ini saya akan membahas bagaimana membuat Header Menu menggunakan HTML dan CSS. Baca Juga Pengertian HTML dan Baca Juga Pengertian CSS.
B.Latar Belakang
Dalam kesempatan ini saya akan sharing sedikit bagaimana membuat sebuah Header Menu HTML CSS. 

C.Maksud dan Tujuan
Ingin membuat suatu layout website.

D.Pembahasan
Navbar menu atau seringkali disebut Header Menu merupakan tampilan yang praktis untuk memungkinkan tampilan dari website kita menjadi bagus atau enak di pandang. Nah di hari ini saya akan mengsharing sedikit tentang bagaimana cara membuat Header Menu Praktis. 
Pertama siapkan alat dan bahan yaitu sofware pendukung seperti Sublime , Notepad++, dan lainnya. JIka sudah silahkan ikuti gambar dibawah untuk memulainya.
File HTML
Jika sudah mengikuti seperti gambar di bawah. Silahkan save filenya dengan ekstensi .html. 

Selanjutnya buka tab baru dan buat file baru dengan ekstensi .css jika sudah silahkan ikuti gambar di bawah.  

NOTE : Jika ingin file CSS nya bisa terproses silahkan tembahkan script seperti berikut <link rel=”stylesheet” type=”text/css” href=”namafile.css”>. Fungsi “Link” bersifat untuk memanggil file tambahan seperti .CSS dan jika file nya sama di dalam folder tersebut maka pemanggilannya contoh seperti (href=”namafile.css”) dan jika file CSS yang berada pada di luar satu folder maka pemanggilannya seperti (href=”namafolder/namafile.css”).

File CSS
 Jika sudah mengikuti seperti contoh di atas maka tampilan file html yang telah di buat tadi akan seperti dibawah.
Tampilan Dari HTML dan CSS
E.Kesimpulan
Sebaiknya dalam pembuatan sebuah layout website file HTML dan CSS dipisah agar proses pembuatan tidak membuat pusing. Download W3School Offline Google Drive.

F.Penutup
Itulah tadi sedikit sharing dari saya semoga dapat bermanfaat .Waasalamu’alaikum. 

G.Referensi
Teman-Teman Di BLC







Comments