Ada banyak simbol yang tidak bisa kita ketik secara manual (karena tidak ada di keyboard). Ucapkan seperti simbol sigma ∑, simbol hak cipta ©, mata uang euro €, root √, atau bahkan emoji seperti 😂😬😁😅😆😎
Dalam aplikasi pengolah kata seperti Microsoft Office, Google Docs, atau Libre Office, menulis simbol atau emoji sangatlah mudah. kita hanya perlu mencari tombol simbol lalu klik simbol yang kita inginkan
Tangkapan layar menambahkan simbol ke kantor gratis
Menambahkan Simbol ke HTML
Ada 3 cara untuk menambahkan simbol ke HTML
Cara pertama dan termudah adalah. salin/tempel dari aplikasi lain. Simbol dapat kita temukan baik dari dokumen web, dari aplikasi pengolah teks, dll, lalu salin ke dalam dokumen HTML kita
Cara kedua adalah. menggunakan nama entitas. Sebagian besar simbol memiliki nama entitas. Kita dapat menggunakan kombinasi sintaks &<nama-entitas>; untuk menampilkan simbol-simbol tertentu
Misalnya kita ingin menampilkan sebuah simbol dengan copy nama entitas dan euro, kita dapat menuliskannya sebagai berikut
- € = €
- © = ©
Cara ketiga adalah dengan menggunakan kode entitas. Sintaks penulisannya sama seperti jika kita menggunakan nama entitas, kita hanya perlu mengganti nama dengan kode
- © = ©
- € = €
Kesatuan
Berikut ini adalah contoh karakter entitas dalam HTML
HasilDeskripsiNama EntitasKode Entitasnon-breaking space (spasi paksa) <p> Tag <h1> adalah tag untuk menampilkan judul pada HTML </p> 0lebih dari (greater than)<p> Tag <h1> adalah tag untuk menampilkan judul pada HTML </p> 3<p> Tag <h1> adalah tag untuk menampilkan judul pada HTML </p> 4&dan<p> Tag <h1> adalah tag untuk menampilkan judul pada HTML </p> 5<p> Tag <h1> adalah tag untuk menampilkan judul pada HTML </p> 6"petik dua<p> Tag <h1> adalah tag untuk menampilkan judul pada HTML </p> 7<p> Tag <h1> adalah tag untuk menampilkan judul pada HTML </p> 8'petik satu<p> Tag <h1> adalah tag untuk menampilkan judul pada HTML </p> 9<p> Tag <h1> adalah tag untuk menampilkan judul pada HTML </p> 0¢mata uang sen<p> Tag <h1> adalah tag untuk menampilkan judul pada HTML </p> 1<p> Tag <h1> adalah tag untuk menampilkan judul pada HTML </p> 2£mata uang pound<p> Tag <h1> adalah tag untuk menampilkan judul pada HTML </p> 3<p> Tag <h1> adalah tag untuk menampilkan judul pada HTML </p> 4¥mata uang yen<p> Tag <h1> adalah tag untuk menampilkan judul pada HTML </p> 5<p> Tag <h1> adalah tag untuk menampilkan judul pada HTML </p> 6€mata uang euro€€©copyright©©®registered trademark<h3>Langsung Salin/Tempel</h3> <p style="font-size: 40pt">😅</p> <h3>Menggunakan nomor desimal</h3> <p style="font-size: 20pt">😅</p> <h3>Menggunakan hexadecimal</h3> <p>😅</p> 1<h3>Langsung Salin/Tempel</h3> <p style="font-size: 40pt">😅</p> <h3>Menggunakan nomor desimal</h3> <p style="font-size: 20pt">😅</p> <h3>Menggunakan hexadecimal</h3> <p>😅</p> 2Contoh penggunaan simbol spasi
<p>Aku suka makan bakso</p> <p>Aku suka minum kopi</p>
Hasil keluaran
Contoh yang salah untuk menampilkan simbol (): ❌❌❌❌
<p> Tag <h1> adalah tag untuk menampilkan judul pada HTML </p>
Hasil keluaran
Sebuah contoh yang benar. . .
<p> Tag <h1> adalah tag untuk menampilkan judul pada HTML </p>
Hasil keluaran
Grup Simbol
CharNumberEntity∀<h3>Langsung Salin/Tempel</h3> <p style="font-size: 40pt">😅</p> <h3>Menggunakan nomor desimal</h3> <p style="font-size: 20pt">😅</p> <h3>Menggunakan hexadecimal</h3> <p>😅</p> 3<h3>Langsung Salin/Tempel</h3> <p style="font-size: 40pt">😅</p> <h3>Menggunakan nomor desimal</h3> <p style="font-size: 20pt">😅</p> <h3>Menggunakan hexadecimal</h3> <p>😅</p> 4∂<h3>Langsung Salin/Tempel</h3> <p style="font-size: 40pt">😅</p> <h3>Menggunakan nomor desimal</h3> <p style="font-size: 20pt">😅</p> <h3>Menggunakan hexadecimal</h3> <p>😅</p> 5<h3>Langsung Salin/Tempel</h3> <p style="font-size: 40pt">😅</p> <h3>Menggunakan nomor desimal</h3> <p style="font-size: 20pt">😅</p> <h3>Menggunakan hexadecimal</h3> <p>😅</p> 6∃<h3>Langsung Salin/Tempel</h3> <p style="font-size: 40pt">😅</p> <h3>Menggunakan nomor desimal</h3> <p style="font-size: 20pt">😅</p> <h3>Menggunakan hexadecimal</h3> <p>😅</p> 7<h3>Langsung Salin/Tempel</h3> <p style="font-size: 40pt">😅</p> <h3>Menggunakan nomor desimal</h3> <p style="font-size: 20pt">😅</p> <h3>Menggunakan hexadecimal</h3> <p>😅</p> 8∅<h3>Langsung Salin/Tempel</h3> <p style="font-size: 40pt">😅</p> <h3>Menggunakan nomor desimal</h3> <p style="font-size: 20pt">😅</p> <h3>Menggunakan hexadecimal</h3> <p>😅</p> 9&<nama-entitas>;0∇&<nama-entitas>;1&<nama-entitas>;2∈&<nama-entitas>;3&<nama-entitas>;4∉&<nama-entitas>;5&<nama-entitas>;6∋&<nama-entitas>;7&<nama-entitas>;8∏&<nama-entitas>;9€0∑€1€2Lebih lengkap. Referensi simbol matematika
Emoji
Untuk menampilkan emot (emoji) kita juga bisa melakukan 3 cara
- langsung salin dan tempel dari sumber lain
- menggunakan kode desimal dari setiap emoji €3
- dan gunakan kode heksadesimal dari setiap emoji €4
Perhatikan contoh berikut
<h3>Langsung Salin/Tempel</h3> <p style="font-size: 40pt">😅</p> <h3>Menggunakan nomor desimal</h3> <p style="font-size: 20pt">😅</p> <h3>Menggunakan hexadecimal</h3> <p>😅</p>
Hasil keluaran
Grup Emoji Wajah
EmojiNomor DesimalNomor Hexadecimal😀1285121F600😁1285131F601😂1285141F602😃1285151F603😄1285161F604😅1285171F605😆1285181F606😇1285191F607😈1285201F608😉1285211F609😊1285221F60A😋1285231F60B😌1285241F60C😍1285251F60D😎1285261F60E😏1285271F60F😐1285281F610😑1285291F611😒1285301F612😓1285311F613😔1285321F614😕1285331F615😖1285341F616😗 1285351F617😘1285361F618😙1285371F619😚1285381F61A😛1285391F61B😜1285401F61C😝1285411F61D😞1285421F61E😟1285431F61F😠1285441F620😡1285451F621😢1285461F622😣1285471F623😤1285481F624😥1285491F625😦1285501F626😧1285511F627😨1285521F628😩1285531F629😪1285541F62A😫1285551F62B😬1285561F62C😭1285571F62D😮1285581F62E😯1285591F62F😰 1285601F630😱1285611F631😲1285621F632😳1285631F633😴1285641F634😵1285651F635😶1285661F636😷1285671F637🙁1285771F641🙂1285781F642🙃1285791F643🙄1285801F644🤐1292961F910🤑1292971F911🤒1292981F912🤓1292991F913🤔1293001F914🤕1293011F915🤠1293121F920🤡1293131F921🤢1293141F922🤣1293151F923🤤1293161F924🤥1293171F925🤧1293191F927🤨 1293201F928🤩1293211F929🤪1293221F92A🤫1293231F92B🤬1293241F92C🤭1293251F92D🤮1293261F92E🤯1293Untuk mendapatkan daftar emoji yang lebih lengkap, silahkan kunjungi getemoji. com, anda tinggal copy paste dari situs tersebut
Kesimpulan
Tidak semua simbol dan karakter tersedia di keyboard kami. Oleh karena itu, HTML memberi kita cara untuk menampilkan simbol, karakter, atau bahkan emoji menggunakan entitas €5
Selain cara manual seperti itu, kita juga bisa praktek copy/paste untuk menambahkan simbol atau emoji yang kita inginkan
Kode Program Lengkap
Bagi anda yang ingin mendapatkan kode program lengkapnya silahkan kunjungi repositori html-dasar di github