id-rocktips

Posts

Showing posts with the label html

Membuat Multi Column Dengan DIV dan CSS

Pretty sure this one is not so different with my older post " Membuat halaman rapi dengan HTML ", yupsi ... bedanya adalah penggunaan fungsi HTML nya, kali ini saya akan menjelaskan bagaimana membuat halaman yang sama seperti postingan sebelumnya, namun menggunakan fungsi DIV di dalam DIV. oke langsung aja . cekidot ... Pertama buat script HTML nya seperti berikut, perhatikan fungsi div yang kita harus panggil berulang-ulang, pasti lebih mudah jika kita menggunakan fungsi table, yup ... or theres another way ?, but this is for education purpose, that should be okay to learn, right ? hhee Kemudian buat file CSSnya seperti berikut, kita membuat dua buah id='kontainer' untuk mengatur batas width/lebar baris pertama dan kedua dan dua buah class='baris' untuk mengatur baris yang ada di kolom kontainer dan class='gambar' untuk mengatur gambar yang di panggil fungsi "imgsrc" Dan jika kamu benar maka hasilnya akan seperti berikut. ...

Membuat Halaman Rapi dengan Table Di HTML

Mungkin Tidak akan sulit jika kamu ingin membuat gambar dan tulisan yang rapi di halaman HTML menggunakan bantuan Adobe DreamWeaver atau WYSIWYG Web Builder, yup .. tinggal tarik dan ketik yang kamu mau, tapi apa sih sebenarnya isi dari koding tersebut ?. Belum tentu kita tahu kan ?. Berikut saya akan membagi sedikit ilmu bagaimana membuat halaman HTML dengan bantuan table, sengaja di buat screenshoot, supaya ngetik sendiri kodenya jadi bisa lebih ngerti. hhhee ... let's code ...!!! Pertama buat isi atau content yang akan kita susun dengan perintah table <div id="section"> <table align="center" class="sifat"> Koding berikut berfungsi untuk memanggil id dan class dari file css. Kemudian buat file cssnya Dan jangan lupa panggil file CSS nya Akhirnya apabila koding yang kamu lakukan benar maka hasilnya akan seperti ini : Di bagian atas kamu bisa lihat tiga tulisan yang tersusun rapi dengan tulisan da...

Pengenalan CSS

Pengertian CSS (Cascading Style Sheet) merupakan suatu bahasa program web yang digunakan untuk mengendalikan dan membangun berbagai komponen dalam web sehingga tampilan web akan menjadi lebih rapi, terstruktur dan seragam. CSS saat ini dikembangkan oleh World Wide Web Consortium (W3C) dan menjadi bahasa standar dalam pembuatan web. CSS difungsikan sebagai penopang atau pendukung, dan pelengkap dari file html yang berperan dalam penataan kerangka dan layout. (sumber) Keuntungan Menggunakan CSS Tanpa CSS pun web dapat dibangun, namun tahukah anda, salah satu kunci kesuksesan web agar banyak pengunjung adalah tampilan yang menarik, interaktif, cepat diakses, dan lain-lain. Jika web sangat lambat di akses, tentu pengunjung juga akan merasa bosan, malah akan menutup browser web mereka, sebelum seluruh informasi dalam web tersebut ditampilkan. Berikut keuntungan menggunakan CSS : 1. Memisahkan pembuatan dokumen (CSS dan ...

Memanggil file CSS ke Halaman HTML

Postingan sebelumnya saya menjelaskan tentang halaman html sederhana dengan layout CSS , yang mana Script CSS di gabungkan ke halaman HTML, kali ini saya akan menjelaskan bagaimana memisahkan file CSS dan cara memanggil file tersebut di halaman HTML. Pertama lihat kembali ke halaman html, buka dengan editor kamu. <!DOCTYPE html> <html> <head> <style> #header { background-color:black; color:white; text-align:center; padding:5px; } #nav { line-height:30px; background-color:#eeeeee; height:300px; width:100px; float:left; padding:5px; } #section { width:350px; float:left; padding:10px; } #footer { background-color:black; color:white; clear:both; text-align:center; padding:5px...

Halaman HTML Sederhana Dengan Layout CSS

Kalau sebelumnya kita sudah membahas halaman html sederhana , kali ini saya akan menjelaskan halaman web html sederhana dengan layout yang tentunya masih sederhana juga. Pertama Copykan Script berikut di notepad++ atau Sublimetext kamu <!DOCTYPE html> <html> <head> <style> #header { background-color:black; color:white; text-align:center; padding:5px; } #nav { line-height:30px; background-color:#eeeeee; height:300px; width:100px; float:left; padding:5px; } #section { width:350px; float:left; padding:10px; } #footer { background-color:black; color:white; clear:both; text-align:center; padding:5px; } </style&gt ; ________________________________________ </head> <bod...

Membuat Halaman HTML Sederhana

Sebelum Kamu belajar HTML pastikan kamu sudah menginstal notepad++ atau Sublimetext untuk mempermudah dalam memilah koding yang akan kamu buat nanti Document HTML di mulai dengan <html> dan </html> untuk mengakhiri. Contoh Document HTML <!DOCTYPE html> <html> <head> <title>Page Title</title> </head> <body> <h1>This is a heading</h1> <h2>This is a heading</h2> <h3>This is a heading</h3> <p>This is a paragraph.</p> </body> </html> Save file dengan nama belajar.html kemudian double klik file untuk membuka browser dan hasilnya akan menjadi seperti ini : Page Title This is a heading This is a heading This is a heading This is a paragraph. Dengan penjelasan berikut <!DOCTYPE html> /*Menyatakan Document Adalah HTML*/ <html> /*Memulai Coding HTML*/ <head> /*Membuka Ba...

Pengenalan HTML

HTML singkatan dari HyperText Markup Language adalah sebuah bahasa markah yang digunakan untuk membuat sebuah halaman web, menampilkan berbagai informasi di dalam sebuah penjelajah web Internet dan pemformatan hiperteks sederhana yang ditulis dalam berkas format ASCII agar dapat menghasilkan tampilan wujud yang terintegerasi. Dengan kata lain, berkas yang dibuat dalam perangkat lunak pengolah kata dan disimpan dalam format ASCII normal sehingga menjadi halaman web dengan perintah-perintah HTML. " Wikipedia " HTML adalah sebuah standar yang digunakan secara luas untuk menampilkan halaman web. HTML saat ini merupakan standar Internet yang didefinisikan dan dikendalikan penggunaannya oleh World Wide Web Consortium (W3C). HTML dibuat oleh kolaborasi Caillau TIM dengan Berners-lee Robert ketika mereka bekerja di CERN pada tahun 1989 (CERN adalah lembaga penelitian fisika energi tinggi di Jenewa). " Wikip...