Hallo Sobat salam ngebul dari saya wkwkwkwk, baru mau mulai belajar HTML?, mungkin itu pertanyaan yang sudah jelas jawabannya, karena kalau tidak ngapain sobat ke artikel ini :D. Baiklah untuk memulai belajar pada pertemuan kali ini KUMPULAN TUGAS INFORMATIKA akan membahas mengenai TAG yang ada di HTML5, HTML5?. Yo'ih, HTML versi terbaru saat ini adalah HTML5 biar lebih Up To Date pastinya maka kita akan belajar HTML5, TAG pada HTML5 ada banyak sekali dan kita akan mencobanya semua. Oke langsung saja keburu dingin langsung kita coba.
1. <!-- ... -->
Tag ini berfungsi untuk menyisipkan komentar atau penjelasan dari Coding sobat agar mudah di ingat da dipahami dan komentar tersebut tidak akan tampil di Web Browser, bisa juga menyembunyikan atau mematikan Script Coding agar todak terbaca oleh Compiler atau Web Browser. tag ini akan sangat berguna jika sobat mempunyai baris Coding yang banyak.
Contoh
Codingnya Begini gan :
<!--Ini Komentarnya. Komentar Nggak Akan Ditampilin di Browser-->
<p>Isi Paragraf Disini aja..</p>
HASILNYA :
<!--Ini Komentarnya. Komentar Nggak Akan Ditampilin di Browser-->
Isi Paragraf Disini aja..
2. <!DOCTYPE>
Tag ini harus di deklarasikan pertama kali sebelum Tag <HTML>, Tag ini berfungsi untuk instruksi kepada Web Browser bahwa tipe dokumen yang ditulis adalah HTML5.
Contoh
Codingnya Begini gan :
<!DOCTYPE html>
<html>
<head>
<tittle>Ini Tittle Dokumennya <tittle>
</head>
<body>
Ini isi Artikelnya gan .. .. ..
</body>
</html>
HASILNYA :
Ini isi Artikelnya gan .. .. ..
3. <a>
Tag ini berfungsi sebagai deklarasi hyperlink atau untuk menyisipkan LINK kedalam suatu objek misalnya kedalam teks. jika teks yang berisi Link di klik maka akan menuju halaman yang di tuju. Atribut terpenting yang mendapingi Tag ini adalah <href> yang menunjukan tujuan Link yang di sisipkan.
Contoh
Codingnya Begini gan :
<a href="https://kumpulan-tugas-informatika.blogspot.com/"> Kunjungi Blog Kumpulan Tugas Informatika Ini Ya! </a>
Jika sudah benar maka teks akan berwarna biru yang berarti bahwa teks tersebut berisi tautan atau Link didalamnya.
4. <abbr>
Tag ini berfungsi untuk menyisipkan <tittle> kedalam suatu teks, biasanya digunakan sebagai penjelasan dari suatu singkatan, misalnya jika mouse sobat diarahkan ke tulisan HTML5. di artikel ini maka akan muncul kepanjangannya, coba saja kalau tidak percaya :D, untuk <tittle> terserah mau sobat tulis apa saja boleh.
Contoh
Codingnya Begini gan :
Pengen Bisa <abbr tittle ="How To Meet Ladies, Misalnya:D"> HTML </abbr> Biar Bisa Bikin Web.
HASILNYA :
Pengen Bisa HTML Biar Bisa Bikin Web.
5. <address>
Dari nama Tag nya pun sudah jelas, bahwa Tag ini berfungi untuk menjelaskan alamat atau informasi kontak orang yang di tuju minsalnya pemilik dokumen atau penulis artikelnya.
Contoh
Codingnya Begini gan :
<address>
Ditulis Oleh <a href="https://kumpulan-tugas-informatika.blogspot.com/"> Neko-Chan </a>.<br>
Tag ini Mampu memberikan deskripsi mengenai tempat atau area didalam peta ata gambar, jika di klik maka akan menuju gambar selanjunya yang menjadi deskripsi dari gambar yang diklik tersebut.
Contoh
Codingnya Begini gan :
<!DOCTYPE html>
<html>
<body>
<p>Klik Pada Gambar Matahari Atau Planet-Planet Kecil Untuk Melihat Lebih Dekat : </p>
Klik Pada Gambar Matahari Atau Planet-Planet Kecil Untuk Melihat Lebih Dekat :
7. <article>
Tag ini berfungsi untuk mendefinisikan suatu artikel didalamnya, elemen ini berdiri sendiri yang artinya tidak terhubung atau terkait dengan konten lain.
Contoh
Codingnya Begini gan :
<article>
<h1>Belajar Pemrograman</h1>
<p>Pemrograman itu sulit, tapi karena itulah pemrograman itu keren</p>
<article>
HASILNYA :
Belajar Pemrograman
Pemrograman itu sulit, tapi karena itulah pemrograman itu keren
8. <aside>
Tag ini berfungsi untuk mendefinisikan beberapa konten dan juga harus terkait dengan konten disekitarnya.
Contoh
Codingnya Begini gan :
<p>Pakde temen saya berkunjung di kos-kosan dekat kos temennya temen saya</p>
<aside>
<h4>Kosan Elik</h4>
<p>Pengen pulang tapi memeng di jalan</p>
</aside>
HASILNYA :
Pakde temen saya berkunjung di kos-kosan dekat kos temennya temen saya
9. <audio>
Tag ini berfungsi untuk menyisiplan sebuah audio kedalam Script, file audio harus satu folder dengan file html yang sobat buat.
Hypertext Markup Language (HTML) 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.
</blockquote>
HASILNYA :
Hypertext Markup Language (HTML) 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.
15. <body>
<body> merupakan bagian "tubuh" pada HTML, yang berisikan artikel, gambar, tabel dll.
Contoh
Codingnya Begini gan :
<html>
<head>
<title>Tittle Dokumen</title>
</head>
<body>
Ini Tempat Mengisi Konten .. .. ..
</body>
</html>
HASILNYA :
Ini Tempat Mengisi Konten .. .. ..
16. <br>
<br> digunakan jika sobat ingin ganti baris, istilah biasanya disebut Enter.
Contoh
Codingnya Begini gan :
Pemrograman Itu Mumet,<br> Mumet dan Mumet
HASILNYA :
Pemrograman Itu Mumet,
Mumet dan Mumet
17. <button>
<button> digunakan untuk membuat tombol, biasanya disertai dengan atribbut type = submit, digunakan untuk submit Password dan Username Jika sobat membuat form login.
Contoh
Codingnya Begini gan :
<button type="button">Click Me!</button>
HASILNYA :
18. <caption>
<caption> digunakan untuk mendefinisikan judul pada tabel.
Contoh
Codingnya Begini gan :
<table>
<caption>Monthly savings</caption>
<tr>
<th>Month</th>
<th>Savings</th>
</tr>
<tr>
<td>January</td>
<td>$100</td>
</tr>
</table>
HASILNYA :
Monthly savings
Month
Savings
January
$100
19. <cite>
<cite> digunakan untuk mendefinisikan judul dari sebuah karya, misalnya dari lagu, buku, film, dll.
Contoh
Codingnya Begini gan :
<p><cite>The Scream</cite> by Edward Munch. Painted in 1893.</p>
HASILNYA :
The Scream by Edward Munch. Painted in 1893.
20. <code>
<code> digunakan untuk mendefinisikan text kode komputer.
Contoh
Codingnya Begini gan :
<code>Tulisannya Akan Menjadi Seperti Ini.</code>
HASILNYA :
Tulisannya Akan Menjadi Seperti Ini.
21. <col>
<col> digunakan untuk mendefinisikan atribut untuk kolom pada tabel.
<fieldset> berfungsi untuk digunakan untuk elemen kelompok terkait dalam formulir.
Contoh
Codingnya Begini gan :
<form>
<fieldset>
<legend>Personalia:</legend>
Name: <input type="text"><br>
Email: <input type="text"><br>
Date of birth: <input type="text">
</fieldset>
</form>
HASILNYA :
32. <figcaption>
<figcaption> berfungsi untuk untuk menandai sebuah foto dalam dokumen. Gambar harus satu folder dengan file HTML sobat, atau bisa ambil langsung dari internet seperti contoh dibawah.
<form> berfungsi untuk membuat bentuk HTML untuk input pengguna.
Contoh
Codingnya Begini gan :
<form>
First name: <input type="text" name="FirstName" value="Mickey"><br>
Last name: <input type="text" name="LastName" value="Mouse"><br>
<input type="submit" value="Submit">
</form>
HASILNYA :
36. <h1> - <h6>
<h1> - <h6> berfungsi untuk mendefinisikan heading atau judul.
Contoh
Codingnya Begini gan :
<h1>This is heading 1</h1>
<h2>This is heading 2</h2>
<h3>This is heading 3</h3>
<h4>This is heading 4</h4>
<h5>This is heading 5</h5>
<h6>This is heading 6</h6>
HASILNYA :
This is heading 1
This is heading 2
This is heading 3
This is heading 4
This is heading 5
This is heading 6
37 <head>
<head> berfungsi untuk mendefinisikan informasi tentang document.
Contoh
Codingnya Begini gan :
<!DOCTYPE html>
<html>
<head>
<title>Tittle Dokumen</title>
</head>
<body>
Ini Tempat Mengisi Konten .. .. ..
</body>
</html>
HASILNYA :
Ini Tempat Mengisi Konten .. .. ..
38<header>
<header> merupakan wadah untuk konten pengantar atau satu set link navigasi.
Contoh
Codingnya Begini gan :
<article>
<header>
<h1>Judul Paling Besar Disini</h1>
<h3>Sedikit Besar Disini</h3>
<p>Beberapa Informasi Disini</p>
</header>
<p>Dan Ini Headernya</p>
</article>
HASILNYA :
Judul Paling Besar Disini
Sedikit Besar Disini
Beberapa Informasi Disini
Dan Ini Headernya
39 <hr>
<hr> berfungsi untuk mendefinisikan garis horisontal.
Contoh
Codingnya Begini gan :
<h1>HTML</h1>
<p>Belajar HTML itu Nggak Sulit.</p>
<hr>
<h1>CSS</h1>
<p>CSS Itu Pacarnya HTML.</p>
HASILNYA :
HTML
Belajar HTML itu Nggak Sulit.
CSS
CSS Itu Pacarnya HTML.
40<html>
<html> berfungsi untuk memberitahu browser bahwa ini adalah dokumen HTML, dan merupakan hal terpenting, bisa disebut juga akar dari sebuah dokumen HTML.
Contoh
Codingnya Begini gan :
<!DOCTYPE html>
<html>
<head>
<title>Tittle Dokumen</title>
</head>
<body>
Ini Tempat Mengisi Konten .. .. ..
</body>
</html>
HASILNYA :
Ini Tempat Mengisi Konten .. .. ..
41 <i>
<i> berfungsi untuk membut teks menjadi miring atau italic
Contoh
Codingnya Begini gan :
<i>INI TEKS NYA MIRING GAN<i>
HASILNYA :
INI TEKS NYA MIRING GAN
42<iframe>
<iframe> berfungsi untuk mendefinisikan inline sub frame.
<menuitem label="Email This Page" onclick="window.location='mailto:?body='+window.location.href;"></menuitem>
</menu>
</div>
<p>This example currently only works in Firefox!</p>
HASILNYA :
Right-click inside this box to see the context menu!
This example currently only works in Firefox!
55. <meta>
<meta> dapat menjelaskan tentang meta data dalam HTML, hal ini sangat berfungsi saat sobat sedang membuat sebuah artikel di blog atau website sobat agar artikel mudah dikenali menin pencari Google, istilahnya artikel yang Friendly Search Engine. tag ini tidak akan ditampilkan di Browser, jadi untuk hasil tidak ada.
Contoh
Codingnya Begini gan :
<head>
<meta charset="UTF-8">
<meta name="description" content="Free Web tutorials">
HASILNYA :(Tag Script Tidak Ditampilkan Di Browser)
66. <section>
<section> berfungsi untuk mendefinisikan bagian dalam sebuah dokumen, seperti header, bab, footer dll.
Contoh
Codingnya Begini gan :
<section>
<h1>WWF</h1>
<p>The World Wide Fund for Nature (WWF) is....</p>
</section>
HASILNYA :
WWF
The World Wide Fund for Nature (WWF) is....
67. <select>
<select> digunakan untuk membuat daftar drop-down.
Contoh
Codingnya Begini gan :
<select>
<option value="volvo">Volvo</option>
<option value="saab">Saab</option>
<option value="mercedes">Mercedes</option>
<option value="audi">Audi</option>
</select>
HASILNYA :
68. <small>
<small> digunakan untuk mendefinisikan text kecil.
Contoh
Codingnya Begini gan :
<p>Pemrograman WEB</p>
<p><small>Belajar Desain WEB</small></p>
HASILNYA :
Pemrograman WEB
Belajar Desain WEB
69. <sourch>
<sourch> digunakan untuk menentukan sumber beberapa media, seperti audio, gambar, video dll. Siapkan file media terlebih dahulu dan taruh satu folder dengan dile HTML sobat.
<u> berfungsi untuk memberikan garis bawah pada text yang dipilih.
Contoh
Codingnya Begini gan :
<p>This is a <u>parragraph</u>.</p>
HASILNYA :
This is a parragraph.
89. <video>
<video> berfungsi untuk menentukan video, seperti klip film atau video stream lainnya.
Contoh
Codingnya Begini gan :
<video width="320" height="240" controls>
<source src="https://www.apacara.com/media/video/halwa.mp4" type="video/mp4">
<source src="https://www.apacara.com/media/video/halwa.ogv" type="video/ogg">
Your browser does not support the video tag.
</video>
HASILNYA :
90. <wbr>
<wbr> berfungsi untuk menentukan di mana dalam teks yang tepat untuk menambahkan baris-break.
Contoh
Codingnya Begini gan :
s
<p>
To learn AJAX, you must be familiar with the XML<wbr>Http<wbr>Request Object.
</p>
HASILNYA :
To learn AJAX, you must be familiar with the XMLHttpRequest Object.
0 Response to "Mencoba Seluruh Tag HTML5 Dan Penjelasannya"
Posting Komentar