کدلپر - مرجع جامع آموزش برنامه‌نویسی

All Right Reserved © 2025 Codoloper

background codoloper

استفاده از ایموجی ها در HTML

خانه

استفاده از اموجی‌ها (Emojis) در HTML

اموجی‌ها کاراکترهایی از مجموعه کاراکتر UTF-8 هستند: 😄 😍 💗

اموجیمقدار
🗻🗻
🗼🗼
🗽🗽
🗾🗾
🗿🗿
😀😀
😁😁
😂😂
😃😃
😄😄
😅😅

 


مثال‌های اموجی در HTML

🚀🚁🚂🚃🚄

نمادهای حمل‌ونقل اموجی در HTML

💺💻💼💽💾

نمادهای اداری اموجی در HTML

👮👯👰👱👲

نمادهای افراد اموجی در HTML

🐂🐃🐄🐅🐆

نمادهای حیوانات اموجی در HTML

 


اموجی‌ها چه هستند؟

اموجی‌ها شبیه به تصویر یا آیکون به نظر می‌رسند، اما اینطور نیست. آن‌ها حروف (کاراکتر) از مجموعه کاراکتر UTF-8 (یونیکد) هستند. UTF-8 تقریباً تمام کاراکترها و نمادهای موجود در جهان را پوشش می‌دهد.


خصوصیت charset در HTML

برای نمایش صحیح یک صفحه HTML، مرورگر وب باید مجموعه کاراکتر (character set) استفاده شده در آن صفحه را بداند. این موضوع در تگ <meta> مشخص می‌شود:

<meta charset="UTF-8">

 

اگر این مورد مشخص نشود، UTF-8 مجموعه کاراکتر پیش‌فرض در HTML است.


کاراکترهای UTF-8

بسیاری از کاراکترهای UTF-8 را نمی‌توان با کیبورد تایپ کرد، اما همیشه می‌توان آن‌ها را با استفاده از شماره‌ها (که شماره انتیتی نامیده می‌شوند) نمایش داد:

  • A برابر با 65 است

  • B برابر با 66 است

  • C برابر با 67 است

مثال

<!DOCTYPE html>
<html>
  <head>
    <meta charset="UTF-8" />
  </head>
  <body>
    <p>I will display A B C</p>
    <p>I will display &#65; &#66; &#67;</p>
  </body>
</html>

توضیح مثال

  • عنصر <meta charset="UTF-8"> مجموعه کاراکتر را تعریف می‌کند.

  • کاراکترهای A، B و C با شماره‌های 65، 66 و 67 نمایش داده می‌شوند.

  • برای اینکه مرورگر بفهمد شما در حال نمایش یک کاراکتر هستید، باید شماره انتیتی را با &# شروع کرده و با ; (نقطه ویرگول) به پایان برسانید.


کاراکترهای اموجی

اموجی‌ها نیز کاراکترهایی از الفبای UTF-8 هستند:

  • 😄 برابر با 128516 است

  • 😍 برابر با 128525 است

  • 💗 برابر با 128151 است

مثال


<!DOCTYPE html>
<html>
  <head>
    <meta charset="UTF-8" />
  </head>
  <body>
    <h1>My First Emoji</h1>

    <p>&#128512;</p>
  </body>
</html>
 

از آنجایی که اموجی‌ها کاراکتر هستند، می‌توان آن‌ها را درست مانند هر کاراکتر دیگری در HTML کپی، نمایش و تغییر اندازه داد.

مثال



<!DOCTYPE html>
<html>
  <head>
    <meta charset="UTF-8" />
  </head>
  <body>
    <h1>Sized Emojis</h1>

    <p style="font-size: 48px">
      &#128512; &#128516; &#128525; &#128151;
    </p>
  </body>
</html>