Kamis, 12 Desember 2013

Perkenalan HTML5


Pada HTML5, terdapat beberapa tag semantik baru, seperti <header>, <section>, <article>, <aside>, <footer>, <nav>, <video>. Selain itu juga, ada beberapa tag pada html 4 yang tidak dapat digunakan pada html 5.
Tag pada html 5:
<article>          : Mendefinisikan artikel.
<aside>            : Mendefinisikan konten selain konten halaman.
<audio>           : Mendefinisikan audio.
<canvas>         : Mendefinisikan dokumen grafis.
<nav>              : Mendefinisikan navigasi link.
Contoh:
Tag pada html 4
Tag pada html 5
<div id = “header”>

</div>
<header>

</header>
<div id = “footer”>

</div>
<footer>

</footer>
<div id = “nav”>

</div>
<nav>

</nav>
<div id = “sidebar”>

</div>
<aside id = “sidebar”>

</aside>


Pada html 5, kita dapat menampilkan video.
Menampilkan video:
<video width=”xxx” height=”xxx”>
            <source src=”nama_video.mp4” type=”video/mp4”>
            <source src=”video2.mp4” type=”video/mp4”>
</video>
Properties yang digunakan untuk melengkapi penggunaan elemen video:
·         width=”dalam pixel” (Untuk Menentukan lebar video)
·         height=”dalam pixel” (Untuk Menentukan tinggi video)
·         controls=”controls” (Untuk Menampilkan tombol kontrol video)
·         autoplay=”autoplay” (Untuk Memutar video secara otomatis)
·         loop=”loop” (Untuk Mengulangi pemutaran video terus menerus)
·         muted=”muted” (Untuk Menghilangkan Output SUara pada Video)
·         poster=”URL” (Untuk menampilkan gambar awal sebelum video diputar)

Penulisan tag html menjadi:
<video width="320" height="240" autoplay=”autoplay” controls=”controls” poster=”cover.jpg” loop=”loop”> 
  <source src="nama_video.mp4" type="video/mp4"> 
  <source src="video2.mp4" type="video/mp4"> 
</video>



Tidak ada komentar:

Posting Komentar