Tutorial HTML 1 - HTML Dasar

Tutorial Ini hanya dasar saja, tidak akan ada banyak yang di bahas di sini. hanya pengenalan singkat serta cara membuat header, paragraf, link, dan cara menampilkan gambar.

Header

Header atau heding pada html ada enam, yaitu
H1, H2, H3, H4, H5, H6
Perbedaannya yaitu semakin besar angkanya, maka semakin kecil tulisan headernya.
Coba kode di bawah menggunakan text editor

<html>
<body>

<h1>Ini Header Satu</h1>
<h2>Ini Header Dua</h2>
<h3>Ini Header Tiga</h3>
<h4>Ini Header Empat</h4>
<h5>Ini Header Lima</h5>
<h6>Ini Header Enam</h6>

</body>
</html>


Paragraf

Paragraf html menggunakan tag <p>, menggunakan tag ini akan memberikan baris kosong

<html>
<body>

<p>Ini paragraf satu</p>
<p>Ini paragraf dua</p>
<p>Ini paragraf tiga</p>

</body>
</html>


Link

Untuk membuat sebuh link yaitu menggunakan tag <a> dan menggunakan atribut href untuk menentukan alamat linknya

<html>
<body>

<a href="www.google.co.id">Klik di sini</a>

</body>
</html>

Saya pakai alamat google untuk linknya.



Gambar

Gambar menggunakan tag <img> kepanjangan dari image atau gambar dan menggunakan atribut src yang berarti source atau sumber, yaitu sumber gambarnya bisa dari komputer  atau dari internet.

<html>
<body>

<img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgFtRO0TPNBllFAVPMrml4jnXZMBTMdFpW7Bu7a01QVdT07sU6gLFydwITcOBoceokUYqaQFFh_vqEIa-ru4ibU4GXWcDI_Ca3jvDj6tPHiutJngEDn1YNeqe8pJjaJ_ViKV7oLnEvReqHI/s320/logo+alusplus.png">

</body>
</html>

Coba kode di atas, maka akan menghasilkan gambar seperti dibawah ini, dan teks yang di beri warna merah adalah alamat dari gambarnya


logo blog








Gambar bisa di ambil langsung dari komputer juga, yaitu dengan cara menyinpan file html dan file gambar (gif, jpg, png, dll) di folder yang sama dan ganti source atau sumber gambarnya dengan nama gambar tersebut contoh


<body>
<html>

<img src="gambar.jpg">

</body>
</html>



Buat dan simpan dokumen HTML seperti di atas di suatu folder dan simpan pula gambar berformat jpg di folder yang sama, lalu ganti namanya menjadi gambar.jpg (sesuai dengan atribut src). Lalu buka file html nya dengan browser internet.

Tip: Gunakan Huruf Kecil Pada Tag

Dalam membuat tag pada HTML dapat menggunakan hurup besar maupun kecil, contoh tag <P> dan tag <p> sama saja. Banyak website yang menggunakan hurup besar pada pembuatan tag.

Tapi sebaiknya jangan pedulikan itu, karena World Wide Web Consortium (W3C) merekomendasikan huruf kecil pada HTML 4, dan menuntut tag dengan huruf kecil pada XHTML.





coba kode html di sini







0 komentar:

Posting Komentar

 
© 2012 Alusplus | Blogger.com