HTML POST Basic-HTML

Basic HTML - Quotation

8. Basic HTML -Quotation

Pada sesi kali kita akan membahas tentang quotation di HTML, memahami tentang quotation, element apa saja yang ada di quotation dan fungsi dari quotation. lansung saja kita akan bahas tentang quotation.

Apa itu Quotation?

Quotation adalah pengambilan suatu kata atau ekspresi agar tulisan yang di buat dapat diperkuat dari sumber yang jelas supaya artikel yang dibuat tidak memiliki asumsi yang tidak jelas. Kutipan biasanya juga ditandai dengan tanda kutip dari sumber aslinya.

Jenis Quotation

Ada 6 jenis quotation yang dapat digunakan dan memiliki fungsi yang berbeda. Berikut kelompok tags quotation dan cara penulisan scriptnya :

  1. <blockquote>

    Tag yang pertama adalah <blockquote>, tag ini mendefenisikan sebuah kutipan yang di ambil dari sumber lain. Attribute yang digunakan untuk tag ini yaitu cite yang berfungsi untuk menandai asal kutipan di ambil. Berikut cara menulis tag <blockquote>

    <p> Kutipan ini merupakan kutipan dari tdf programming :
       <blockquote cite="https://tdfprogramming.com/"> Hal yang paling sulit dalam belajar adalah memulai. Memulai untuk membagai waktu, melakukannya. Solusinya yaitu paksakan</blockquote>
    </p>
    

    Browser akan menampilkan seperti gambar berikut :

    blockquote

    Teks yang berada di dalam tag <blockquote> secara otomatis teks akan menjorok ke tengah.

  2. <q>

    Tag <q> digunakan untuk kutipan singkat. Browser secara otomatis akan menampilkan tanda kutip di dalam tag <q>. Berikut cara penulisan tag <q>

    <p>Text ini <q> merupakan kutipan</q> </p>
    

    q

  3. <abbr>

    Tag <abbr> digunakan untuk mendefenisikan singkatan seperti HTML, PHP, CSS, JS dan lain sebagainnya. Menggunakan tag <abbr> juga berfungsi untuk memberikan informasi saat penelusuran, penerjamahan, dan search enggine.

    Tag <abbr> merupakan arti dari abbreviation, jika kita artikan ke dalam bahasa Indonesia yaitu singkatan. Nah sekarang sudah semakin jelas kegunaan tag <abbr>. Tag ini memiliki attribute yang wajib untuk digunakan, yaitu attribute title yang berfungsi untuk menampilkan popup singkatan terhadap text yang disingkat saat kursor di arahkan ke text tersebut. Mungkin ini sedikit membingungkan, lansung saja kita cobakan untuk menulis scriptnya:

    <p> Singkatan dari  <abbr title="Triadmoko Denny Fatrosa"> TDF </abbr> Programming di ambil dari nama penulisnnya</p> 
    

    abbr

    Untuk membuktikan salin script di atas lalu arahkan kursor pada text TDF maka singkatan TDF akan terlihat seperti popup.

  4. <address>

    Pada Tag <address> mungkin tidak aneh lagi kalau kita artikan ke dalam bahasa Indonesia yaitu alamat. Tag ini memberikan informasi kontak/penulis/dokumen atau yang lainnya.

    Informasi tag pada <address> dapat berisi tentang nama, alamat email, alamat jalan, no telp dan lain sebagainya.

    Text yang berada pada tag <address> akan di tampilkan ke dalam browser dengan huruf miring. Berikut penulisan tag <address>

    <address>
       Penulis : Triadmoko Denny Fatrosa <br>
       Alamat : Panyakalan, Solok, Sumatera Barat <br>
       Website : www.tdfprogramming.com <br>
       Phone : 082222222222
    </address>
    

    Hasil yang di tampilkan di browser seperti gambar berikut:

    address

  5. <cite>

    Tag <cite> berfungsi mendefenisikan judul karya kreatif misalnya, Buku, Puisi, Lagu, Film dan lain sebagainya. Akan tetapi nama seseorang bukanlah sebuah karya. Teks pada tag <cite> akan di tampilkan di dalam browser menjadi text miring. Berikut contoh scirpt pada tag <cite> :

    <p>Buku yang berjudul <cite>Full Stack Web Developer</cite> Karya Kamu tahun 2999</p>
    

    cite

  6. <bdo>

    Tag <bdo> merupakang singkatan dari Bi-Directional Override jika kita artikan yaitu Penggantian Dua Arah. Tag ini berfungsi untuk mengganti arah text.

    Ada pun attribute yang digunakan tag <bdo> yaitu dir, nilai atau value pada attribute dir ada 2 yaitu,

    • ltr Left-to-right text direction (arah text kiri ke kanan)
    • rtl Right-to-left text direction (arah text kanan ke kiri)

    Secara default tag <bdo> memiliki attribute dir yang value-nya yaitu ltr. Berikut penulisan script pada tag <bdo>:

    <bdo dir="rtl">Text ini merupakan tag bdo </bdo>
    

    Berikut tampilan pada browser :

    bdo

Kesimpulan

Tags yang ada pada quotation memiliki berbagai fungsi. Coba lakukan pengujian pada script tersebut untuk melihat hasilnya. lakukan berulang kali agar paham dari tujuan script tersebut.

Sumber

W3Shcools Quotation