Nurul Imam Studio

Belajar HTML, CSS, JavaScript, PHP & MySQL untuk pemula & tingkat lanjut

Jasa Pembuatan Website Profesional

Beberapa Inline Tag HTML5 Beserta Fungsinya

Sebelumnya “Blog & Note of Nurul Imam” sudah menulis tentang Pengenalan Tag HTML5, Dalam artikel ini akan menjelaskan Inline Tag yang ada di HTML5. Ada tag apa saja sih ? Yuk kita lihat tag-tag tersebut.

<mark>Untuk menandai</mark>
<time>Untuk waktu</time>
<meter>Untuk konten media ukur seperti persentasi</meter>
<progress>Untuk informasi progress meter</progress>

Sementara 4 tag itu saja dulu yang akan saya contohkan dalam tulisan ini. Untuk contoh penggunaannya bisa anda ketikkan kode dibawah ini.

Demo Inline Tag HTML5
<p>Ini contoh tulisan yang <mark>ditandai</mark> dengan tag <mark></mark></p>
<p>Ini contoh penulisan waktu dengan tag <time> pada jam <time>09:00</time></p>
<p>Dibawah ini contoh penggunaan tag <meter></p>
<meter value="60" min="0" max="100">60%</meter><br />
<meter value="0.8">80%</meter>
<p>Dibawah ini contoh penggunaan tag <progress></p>
<progress value="22" max="100"></progress>

Dari hasil demonya itu tanpa menggunakan style CSS, jadi kita bisa mempercantiknya dengan sentuhan CSS3. Tinggal kreatifits kita yang bicara :)

12 Comments

  1. Juragan CipirReply

    kunjungan perdana ^_^
    saya ijin menyimak ya mas agar bisa ngerti inline tag html5 serta fungsinya, hehehe :)
    ntar kalo sdh ngerti saya praktekkan suatu saat :D
    makasih sharingnya yg bermanfaat ^^

    • Nurul ImamReply

      Iya sama-sama :)

  2. AgriReply

    Tapi tag tersebut jrng sekali (bahkan tidak pernah dipakai) utk para blogger (pengguna blogspot mas). Oya mas, sekalian mau nanya ni, kalau pengguan progres tersebut bsa kita bikin sebagai pengganti efek loading blog gk?

    • Nurul ImamReply

      Bisa aja mas, tinggal dipaduin sama JavaScript aja untuk prosesnya :)

      • AgriReply

        berarti js nya kita rancang lagi dong mas? kalau masalah js ampun dah pusyingg cyin wkwkwk
        kalau bsa bikin dong mas tutorialnya haha :D

        • Nurul ImamReply

          Hahahaha berusaha donk, sama aja kok konsepnya kayak bikin tampilan hemat energy di blogspot. Saya udah lama ga maenan blogspot jadi males mau buka dashboardnya :p

  3. Index ApkReply

    ane gk pernah pake kode yang beginian mas imam…hehe

    • Nurul ImamReply

      Trus pakenya apa donk :D

  4. Mizz AizaReply

    kelihatan menarik.. ia boleh digunakan untuk apa ya?

    • Nurul ImamReply

      Untuk menampilkan waktu, progress, dan sebagainya yang mana sudah saya jelaskan diatas :)

  5. Intan SudibjoReply

    oh ternyata itu menggunakan tag html5 progress yah hehe.. boleh dicoba nih mas :)

    makasih

    • Nurul ImamReply

      Hayu monggo dicoba progressnya :)

Leave a Reply

Your email address will not be published. Required fields are marked *

You may use these HTML tags and attributes: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <s> <strike> <strong>