Hai sobat untuk dasar html kali ini kita coba untuk membuat sebuah web page, nah struktur utama yaitu kode html itu sendiri. Kalau diibaratkan Sama seperti rumah html dalam web page membutuhkan sebuah frame untuk menempatkanya, kata mudahnya adalah wadahnya. Dalam frame html terdiri dari <! DOCTYPE>, <html>, <head>, dan <body> tag.
Sebagai contoh ketika Anda memulai coba tuliska kode berikut di notepad, simpan dengan format .html dan buka dengan browser dan lihat hasilnya
<!DOCTYPE html>
<html>
<head>
<title>
</title>
</head>
<body>
TULIS PESAN APA SAJA
</body>
</html>
Jika sudah sekarang tambahkan header diantara tag <body> untuk memberikan sebuah judul paragraf dalam postingan web, dengan tag " <h1> judul </h1>".
Buatlah isian dari postingan Anda , dengan menambahkan tag <p> tulisan Anda</p> , Anda juga bisa menambahkan paragraf baru dengan menambahkan tag paragraf lagi. Letakan tag <p> setelah tag <h1> untuk memberikan isi dari header yang sudah Anda tulis lagi.
Untuk menambahkan header lagi dengan isian Anda tinggal mengulangi kode diatas untuk tag header gantikan dengan h2,h3 dan seterusnya untuk membedakan ukuran dalam tiap header.
Sekarang tambahkan gambar dalam web page anda dengan menggunakan tag <img src="url gambar "/> letakan dibawah header. Nah sekarang coba tambahkan link dalam paragraf beru jadi Anda memiliki 1 paragraf tulisan, link dan foto.
contoh berikut kode html yang sudah kita rangkai tadi , disini saya menggunakan gambar sendiri Anda juga bisa mnggunakan gambar lain juga mengubah kata - kata sesuai keinginan Anda sobat.
<!DOCTYPE html>
<html>
<head>
<title> web page Anda</title>
</head>
<body>
<h1>HEADEER 1</h1>
<p> isi paragraf</p>
<p> isi paragraf </p>
<img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgvb2b0yPJNrqlIGgEdhYzJ25YE_XnZ8iZ9sGfHn3omQTVccB0adXGKBxUi_tv3ZPBH7WeYRmCss4Rnl5nBKsNwOvDcfWQRKdAwtPjtHpVuut0DsHDO8AiqwyyODF-UsI8E9ACCQHE1WWqJ/s1600/untitled.JPG" />
<p> <a href="http://justkode.blogspot.com/"/>BELAJAR HTML</a> </p>
</body>
</html>
Nah sekarang kita tahu tahapan awal dalam membuat web page sederhana hanya dengan kode dasar html, jika sudah berhasil maka akan tampak seperti gambar dibawah ini.
 |
| contoh hasil kode |
bagaimana sobat mudah kan ? jangan sungkan bertanya ya ,
0 comments:
Post a Comment