Character entity HTML

Entity artinya adalah symbol sedangkan character entity artinya adalah character yang berupa symbol.

Berikut ini adalah daftar beberapa contoh character entity:

Symbol Penjelasan Nama entity Code entity
" quotation mark " "
' apostrophe ' '
& ampersand & &
< less-than &lt; &#60;
> greater-than &gt; &#62;

Character entity tidak bisa digunakan sebagai bagian dari text karena memiliki fungsi khusus.

Contoh, kita tidak akan bisa memasukkan symbol lebih kecil dari [<] atau symbol lebih besar dari [>] ke dalam text karena kedua symbol tersebut berguna sebagai code markup.

Salah satu cara menampilkan character entity sebagai bagian dari text adalah menggunakan character entity reference. Character entity reference terbagi lagi menjadi dua yaitu nama entity dan code entity. Keduanya (nama entity dan code entity) bisa digunakan untuk menampilkan character entity.

Contoh 1, kita ingin menampilkan symbol lebih kecil dari [<] sebagai text pada browser maka kita bisa menulis seperti ini: [&lt;] atau ini: [&#60;].

Contoh 2, kita ingin menampilkan tulisan ini: [<div id="character">] pada browser maka kita harus menulis seperti berikut ini:

&lt;div id=&quot;character&quot;&gt;

Lihat daftar symbol entity yang lebih lengkap disini.

Space dan <>

Sebenarnya sebanyak apapun space dalam code HTML hanya akan diabaikan oleh web browser karena web browser akan membuat space yang berurutan menjadi satu space. Untuk mengatasi masalah ini dan membuat HTML memunculkan space yang telah kita buat maka kita harus menggunakan symbol [&nbsp;] non-breaking space.

Code space:

Hujan itu &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; turun ke bawah.

Hasil code space:

Hujan itu        turun ke bawah.

Biasanya kita menggunakan symbol lebih kecil [<] dan symbol lebih besar [>] untuk membuat code tag. Namun bagaimana kalau kita ingin membuatnya muncul sebagai text di web page? Untuk itu kamu bisa menggunakan entity seperti di bawah.

Code <>:

<p>
lebih kecil dari/less than - &lt; <br />
lebih besar dari/greater than - &gt; <br />
Body tag - &lt;body&gt;
</p>

Hasil code <>:

lebih kecil dari/less than – <
lebih besar dari/greater than – >
Body tag – <body>

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=""> <strike> <strong>