อีโมจิคืออะไร ?
อิโมจิดูเหมือนรูปภาพหรือไอคอน แต่ไม่ใช่ อิโมิจิเป็นตัวอักษร (อักขระ) จากชุดอักขระ UTF-8 (Unicode)
UTF-8 ครอบคลุมอักขระและสัญลักษณ์เกือบทั้งหมดในโลก
HTML charset Attribute
หากต้องการแสดงหน้าเพจ HTML อย่างถูกต้อง เว็บเบราว์เซอร์ต้องทราบชุดอักขระที่ใช้ในเพจ
สิ่งนี้ระบุไว้ในแท็ก<meta>
<meta charset="UTF-8">หากไม่ได้ระบุ UTF-8 จะเป็นชุดอักขระเริ่มต้นใน HTML
อักขระ UTF-8
เราไม่สามารถพิมพ์อักขระ UTF-8 จำนวนมากบนแป้นพิมพ์ได้ แต่สามารถแสดงโดยใช้ตัวเลขได้เสมอ (เรียกว่าentity numbers)
เช่น A คือ 65 B คือ 66 C คือ 67
ตัวอย่าง
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
</head>
<body>
<p>การแสดงผล A B C</p>
<p>การแสดงผล A B C</p>
</body>
</html>การแสดงผล A B C
การแสดงผล A B C
อธิบายตัวอย่าง
<meta charset="UTF-8"> element ใช้ระบุชุดอักขระเพื่อให้เบราว์เซอร์เข้าใจว่าคุณกำลังแสดงอักขระ คุณต้องขึ้นต้นentity number ด้วย &#และลงท้ายด้วย ; (อัฒภาค)
อีโมจิคาแรคเตอร์
อิโมจิยังเป็นอักขระจากตัวอักษร UTF-8 เช่น
- 😄 คือ 128516
- 😍 คือ 128525
- 💗 คือ 128151
ตัวอย่าง
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
</head>
<body>
<h1>การแสดงผลอีโมจิหน้ายิ้ม</h1>
<p>😀</p>
</body>
</html>
การแสดงผลอีโมจิหน้ายิ้ม
😀
เนื่องจากอิโมจิเป็นอักขระ จึงสามารถคัดลอก แสดง และปรับขนาดได้เช่นเดียวกับอักขระอื่นๆ ใน HTML
ตัวอย่าง
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
</head>
<body>
<h1>การปรับขนาดอีโมิจิ</h1>
<p style="font-size:48px">
😀 😄 😍 💗
</p>
</body>
</html>การปรับขนาดอีโมิจิ
😀 😄 😍 💗
สัญลักษณ์อีโมจิบางตัวใน UTF-8
| อีโมจิ | ค่า |
|---|---|
| 🗻 | 🗻 |
| 🗼 | 🗼 |
| 🗽 | 🗽 |
| 🗾 | 🗾 |
| 🗿 | 🗿 |
| 😀 | 😀 |
| 😁 | 😁 |
| 😂 | 😂 |
| 😃 | 😃 |
| 😄 | 😄 |
| 😅 | 😅 |
