HTML : Formating Text

HTML menyediakan beberapa tag yang dapat digunakan untuk membuat beberapa teks menjadi berbeda, misalnya kalian dapat menggunakan tag <b> untuk membuat teks bold, tag <i> untuk membuat teks italic, beri tag <mark> untuk membuat teks yang disorot/ditandai, beri tag <code> untuk menampilkan fragmen kode komputer, tag <ins> untuk membuat teks yang telah dimasukkan ke dalam dokumen, dan <del> untuk menghapus teks dari dokumen, dan banyak lagi.

Contoh berikut menunjukkan tag format yang paling umum digunakan dalam penerapannya. Sekarang, mari kita coba contoh tag berikut:

<p>This is <b>bold text</b>.</p> 
<p>This is <strong>strongly important text</strong>.</p> 
<p>This is <i>italic text</i>.</p> 
<p>This is <em>emphasized text</em>.</p> 
<p>This is <mark>highlighted text</mark>.</p> 
<p>This is <code>computer code</code>.</p> 
<p>This is <small>smaller text</small>.</p> 
<p>This is <sub>subscript</sub> and <sup>superscript</sup> text.</p> 
<p>This is <del>deleted text</del>.</p> 
<p>This is <ins>inserted text</ins>.</p>

Secara default, tag <strong> biasanya ditampilkan di browser sebagai <b>, sedangkan tag <em> diterjemahkan sebagai <i>. Bagaimanapun, ada perbedaan arti pada kedua tag ini.

Perbedaan antara tag <strong> dan tag <b>

Tag <strong> menunjukkan bahwa isi kontennya memiliki sesuatu yang penting, sedangkan tag <b> hanya digunakan untuk menarik perhatian pembaca tanpa menyampaikan sesuatu hal yang penting di dalam kontennya.

<p><strong>WARNING!</strong> Please proceed with caution.</p> 
<p>The concert will be held at <b>Hyde Park</b> in London.</p>

Perbedaan antara tag <em> and tag <i>

Tag <em> dan <i> merender teks terlampir menjadi tipe italic, tetapi tag <em> menunjukkan bahwa isinya lebih menekankan penekanan dibandingkan dengan teks di sekitarnya, sedangkan tag <i> digunakan untuk menandai teks yang memiliki maksud khusus seperti istilah teknis, ungkapan idiomatik dari bahasa lain, pemikiran, dll.

<p>Cats are <em>cute</em> animals.</p> 
<p>The <i>Royal Cruise</i> sailed last night.</p>

Format Kutipan

Tag <blockquote> digunakan untuk bagian text yang merupakan kutipan panjang. Disebut kutipan panjang karena tag ini merupakan tipe block element, sehingga akan memisahkan diri dari text yang ada menjadi baris baru. Tag <blockquote> lebih cocok digunakan untuk memberikan penegasan penting untuk kutipan.

Blockquote umumnya ditampilkan dengan margin kiri dan kanan yang berlekuk, bersama dengan sedikit ruang tambahan yang ditambahkan di atas dan di bawah. Mari kita coba contoh untuk melihat cara kerjanya:

<blockquote>
    <p>Learn from yesterday, live for today, hope for tomorrow. The important thing is not to stop questioning.</p>
    <cite>— Albert Einstein</cite>
</blockquote>

Menampilkan Singkatan

Singkatan adalah bentuk kata, frasa, atau nama yang disingkat.

Kalian dapat menggunakan tag <abbr> untuk menunjukkan singkatan. <abbr> digunakan bersamaan dengan atribut title yang menjelaskan kepanjangan dari singkatan tersebut dan tidak boleh berisi keterangan lain. Dan akan ditampilkan oleh browser sebagai tooltip ketika kursor mouse berada di atas elemen. Mari kita coba contoh berikut:

<p>The <abbr title="World Wide Web Consortium">W3C</abbr> is the main international standards organization for the <abbr title="World Wide Web">WWW or W3</abbr>. It was was founded by Tim Berners-Lee.</p>

Menandai Alamat Kontak

Halaman web sering menyertakan alamat jalan atau kode pos. HTML menyediakan tag khusus <alamat> untuk mewakili informasi kontak (fisik dan / atau digital) untuk individu ataupun organisasi.

Tag ini idealnya digunakan untuk menampilkan informasi kontak yang terkait dengan dokumen itu sendiri misal seperti penulis artikel. Sebagian besar browser menampilkan blok alamat dalam huruf miring (italic). Berikut contohnya

<address>
Mozilla Foundation<br>
331 E. Evelyn Avenue<br>
Mountain View, CA 94041, USA
</address>