HTML adalah singkatan dari HyperText Markup Language yaitu bahasa pemrograman standar yang digunakan untuk membuat sebuah halaman web, yang kemudian dapat diakses untuk menampilkan berbagai informasi di dalam sebuah penjelajah web Internet (Browser). HTML dapat juga digunakan sebagai link link antara file-file dalam situs atau dalam komputer dengan menggunakan localhost, atau link yang menghubungkan antar situs dalam dunia internet.
Supaya dapat menghasilkan tampilan wujud yang terintegerasi Pemformatan hiperteks sederhana ditulis dalam berkas format ASCII sehingga menjadi halaman web dengan perintah-perintah HTML.
HTML merupakan sebuah bahasa yang bermula bahasa yang sebelumnya banyak dipakai di dunia percetakan dan penerbirtan yang disebut Standard Generalized Markup Language (SGML).
Sekarang ini HTML merupakan standar Internet yang dikendalikan dan didefinisikan pemakaiannya oleh World Wide Web Consortium (W3C). Pada tahun 1989, HTML dibuat oleh kolaborasi Berners-lee Robert dengan Caillau TIM pada saat mereka bekerja di CERN (CERN merupakan lembaga penelitian fisika energi tinggi di Jenewa)
HTTP atau Hypertext Transfer Protokol merupakan protokol yang digunakan untuk mentransfer data atau document yang berformat HTML dari web server ke web browser. Dengan HTTP inilah yang memungkinkan Anda menjelajah internet dan melihat halaman web.
Fungsi HTML (HyperText Markup Language)
HTML (HyperText Markup Language) adalah suatu bahasa yang menggunakan tanda-tanda tertentu (tag) untuk menyatakan kode-kode yang harus ditafsirkan oleh browser agar halaman tersebut dapat ditampilkan secara benar.
Secara umum, fungsi HTML adalah untuk mengelola serangkaian data dan informasi sehingga suatu dokumen dapat diakses dan ditampilkan di Internet melalui layanan web.
Fungsi HTML yang lebih spesifik yaitu :
- Membuat halaman web.
- Menampilkan berbagai informasi di dalam sebuah browser Internet.
- Membuat link menuju halaman web lain dengan kode tertentu (hypertext).
Contoh
Cara membuat menu di Blog sedikit edit HTML.
Selamat siang, apakah anda
kesulitan dalam embuat menu di blog, bagaimana cara membuat menu di blog dengan
mudah ?. Sebelumnya anda harus tau fungsi dari menu bar di haeader blog, fungsi
menu pada blog yaitu untuk memudahkan pengunjung melihat apa saja artikel
menarik yang ada di dalam blog anda dan juga memperindah tampilan blog.
Jika blog anda mengenai sekilas
harga atau warung harga, disana anda harus memikirkan kira – kira menu apa yang
cocok untuk di pasang di blog anda. Biasanya sebuah blog atau website pasti
memiliki menu home atau tampilan awal daari blog itu sendiri, selanjutnya baru
menu tentang artikel dan submenu.
Misalnya kita ambil contoh
membuat menu di blog info harga, bererati kita buat menu home, harga komputer,
harga handphone, harga kendaraan, harga elektronik, harga laptop, dll.
Selanjutnya baru anda buat sub menu yaitu handphone asus, handphone lenovo, dan
mash banyak lainnya. Submenu sama dengan menu dorpdown. Jadi cara membuat menu
dropdown sama dengan membuat sub menu di blog.
Kali ini bacaan gratis akan
membahas mengenai cara membuat menu navigasi blog atau yang sering dikenal
dengan membuat menu bar di blog, untuk lebih jelasnya silahkan anda simak di
bawah ini.
Cara Membuat Sub Menu di Blog
1. Login ke blog anda terlebih
dahulu
2. Masuk ke Tat letak
3. Silahkan Tambahakan
Gadget baru yang terletak di atas postingan blog
4. Pilih HTML/JavaScript
Kemudian anda copy kode script di
bawah ini dan masukan pada Gadget HTML/JavaScript yang sudah di buat
sebelumnya.
<style type=”text/css”>
/*CSS MENU*/
#menu{background:#343434;color:#eee;height:35px;border-bottom:4px solid #eeeded}
#menu ul,#menu li{margin:0 0;padding:0 0;list-style:none;z-index:9999;}
#menu ul{height:35px}
#menu li{float:left;display:inline;position:relative;font:bold 12px Arial;text-shadow: 0 -1px 0 #000;border-right: 1px solid #444;border-left: 1px solid #111;text-transform:uppercase}
#menu li:first-child{border-left: none}
#menu a{display:block;line-height:35px;padding:0 14px;text-decoration:none;color:#eee;}
#menu li:hover > a,#menu li a:hover{background:#111}
#menu input{display:none;margin:0 0;padding:0 0;width:80px;height:35px;opacity:0;cursor:pointer}
#menu label{font:bold 30px Arial;display:none;width:35px;height:36px;line-height:36px;text-align:center}
#menu label span{font-size:12px;position:absolute;left:35px}
#menu ul.menus{height:auto;overflow:hidden;width:180px;background:#111;position:absolute;z-index:99;display:none;border:0;}
#menu ul.menus li{display:block;width:100%;font:12px Arial;text-transform:none;}
#menu li:hover ul.menus{display:block}
#menu a.home {background: #c00;}
#menu a.sub{padding:0 27px 0 14px}
#menu a.sub::after{content:””;width:0;height:0;border-width:6px 5px;border-style:solid;border-color:#eee transparent transparent transparent;position:absolute;top:15px;right:9px}
#menu ul.menus a:hover{background:#333;}
</style>
<!– Mulai Area Menu –>
<nav id=”menu”>
<input type=”checkbox” />
<label>≡Navigation</label>
<ul>
<li><a class=”Home” href=”#“>Home</a></li>
<li><a href=”#“>Menu 1</a></li>
<li><a href=”#“>Menu 2</a></li>
<li><a href=”#“>Menu 3</a></li>
<li><a href=”#“>Menu 4</a></li>
<!– Mulai Area Menu Dropdown –>
<li><a class=”sub” href=”#”>Menus</a> <ul class=”menus”>
<li><a href=”#” title=”Kode Warna HTML”>Menu 1</a></li>
<li><a href=”#”>Sub Menu 1</a></li>
<li><a href=”#”>Sub Menu 2</a></li>
<li><a href=”#”>Sub Menu 3</a></li>
<li><a href=”#”>Sub Menu 4</a></li>
<li><a href=”#”>Sub Menu 5</a></li>
</ul>
</li>
<!– Area Dropdown Selesai–> </ul>
</nav>
<!– Area Menu Selesai–>
5. Kemudian Simpan /*CSS MENU*/
#menu{background:#343434;color:#eee;height:35px;border-bottom:4px solid #eeeded}
#menu ul,#menu li{margin:0 0;padding:0 0;list-style:none;z-index:9999;}
#menu ul{height:35px}
#menu li{float:left;display:inline;position:relative;font:bold 12px Arial;text-shadow: 0 -1px 0 #000;border-right: 1px solid #444;border-left: 1px solid #111;text-transform:uppercase}
#menu li:first-child{border-left: none}
#menu a{display:block;line-height:35px;padding:0 14px;text-decoration:none;color:#eee;}
#menu li:hover > a,#menu li a:hover{background:#111}
#menu input{display:none;margin:0 0;padding:0 0;width:80px;height:35px;opacity:0;cursor:pointer}
#menu label{font:bold 30px Arial;display:none;width:35px;height:36px;line-height:36px;text-align:center}
#menu label span{font-size:12px;position:absolute;left:35px}
#menu ul.menus{height:auto;overflow:hidden;width:180px;background:#111;position:absolute;z-index:99;display:none;border:0;}
#menu ul.menus li{display:block;width:100%;font:12px Arial;text-transform:none;}
#menu li:hover ul.menus{display:block}
#menu a.home {background: #c00;}
#menu a.sub{padding:0 27px 0 14px}
#menu a.sub::after{content:””;width:0;height:0;border-width:6px 5px;border-style:solid;border-color:#eee transparent transparent transparent;position:absolute;top:15px;right:9px}
#menu ul.menus a:hover{background:#333;}
</style>
<!– Mulai Area Menu –>
<nav id=”menu”>
<input type=”checkbox” />
<label>≡Navigation</label>
<ul>
<li><a class=”Home” href=”#“>Home</a></li>
<li><a href=”#“>Menu 1</a></li>
<li><a href=”#“>Menu 2</a></li>
<li><a href=”#“>Menu 3</a></li>
<li><a href=”#“>Menu 4</a></li>
<!– Mulai Area Menu Dropdown –>
<li><a class=”sub” href=”#”>Menus</a> <ul class=”menus”>
<li><a href=”#” title=”Kode Warna HTML”>Menu 1</a></li>
<li><a href=”#”>Sub Menu 1</a></li>
<li><a href=”#”>Sub Menu 2</a></li>
<li><a href=”#”>Sub Menu 3</a></li>
<li><a href=”#”>Sub Menu 4</a></li>
<li><a href=”#”>Sub Menu 5</a></li>
</ul>
</li>
<!– Area Dropdown Selesai–> </ul>
</nav>
<!– Area Menu Selesai–>
Cara Edit Menu Blog Dengan Mudah
Coba anda lihat langkah no 4.
sebelum menyimpan silahkan anda ganti Menu 1, Menu 2, Menu 3,
Menu 4 dengan menu yang ingin anda tampilan.
<li><a
href=”#”>Home</a></li>
<li><a
href=”#”>Tutorial</a></li>
<li><a href=”#”>Umum</a></li>
Cara Edit Menu Dropdown di Blog
Masih di langkah no 4. silahkan
anda ganti Sub Menu 1, Sub Menu 2, Sub Menu 3, Sub Menu 4 sesuai
keinginan anda ,dan ganti tanda # dengan alamat url label blog anda
<!– Mulai Area Menu Dropdown –>
<li><a class=”sub” href=”#”>Menus</a> <ul class=”menus”>
<li><a href=”#” title=”Kode Warna HTML”>Tutorial</a></li>
<li><a href=”http://www.bacaan-gratis.com/search/label/BLOG?max-results=5“>Blog</a></li>
<li><a href=”http://www.bacaan-gratis.com/search/label/KOMPUTER?max-results=5“>Komputer</a></li>
<li><a href=”http://www.bacaan-gratis.com/search/label/NETWORK?max-results=5“>Network</a></li>
Jangan lupa untuk menymipannnya, demikian
pembahasan mengenai cara membuat menu di blog, mengedit menu di blog, dan
mengedit menu dropdown di blog<li><a class=”sub” href=”#”>Menus</a> <ul class=”menus”>
<li><a href=”#” title=”Kode Warna HTML”>Tutorial</a></li>
<li><a href=”http://www.bacaan-gratis.com/search/label/BLOG?max-results=5“>Blog</a></li>
<li><a href=”http://www.bacaan-gratis.com/search/label/KOMPUTER?max-results=5“>Komputer</a></li>
<li><a href=”http://www.bacaan-gratis.com/search/label/NETWORK?max-results=5“>Network</a></li>
0 comments:
Post a Comment