数据结构
网络
关系型数据库管理系统
操作系统
Java
MS Excel
iOS
HTML
CSS
Android
Python
C 编程
C++
C#
MongoDB
MySQL
Javascript
PHP
物理学
化学
生物学
数学
英语
经济学
心理学
社会学
时尚研究
法律研究如何在 HTML 文档中添加表情符号？
表情符号是一些小的数字图像或图标，通常用于消息传递和其他地方来表达情感或想法。在本文中，我们将了解如何在 HTML 文档中添加表情符号。
方法
通过将浏览器中用于显示网页的字符集设置为 UTF-8，可以将表情符号添加到 HTML 文档中。我们可以在头部区域使用 <meta> 标签来指定此字符编码信息。在声明字符集之后，可以使用 p 和 span 标签将表情符号添加到 HTML 中。使用 <span> 标签在同一行插入表情符号，而使用 <p> 标签在新行中插入表情符号。
我们将看看在 HTML 文档中添加表情符号的两种方法：
使用十六进制代码
使用十进制代码
方法 1：使用十六进制代码
我们可以使用它们各自的十六进制代码来指定表情符号。表情符号的十六进制代码以 &#x 开头，以“; “结尾，以告知浏览器需要显示代码表示的字符。例如，✌ 的十六进制代码是 ✌
示例
步骤 1 - 首先，我们将定义基本的 HTML 代码。
<!DOCTYPE html> <html> <head> <title>How to add emoji in HTML document?</title> </head> <body> <h4>How to add emoji in HTML document?</h4> </body> </html>
步骤 2 - 现在，我们将添加表情符号的十六进制代码。
<div> <p>Devil Emoji: <span>😈</span></p> <p>Face having Tears of Joy Emoji: <span>😂</span></p> <p>Thumbs Up Emoji: <span>👍</span></p> </div>
以下是完整代码：
<!DOCTYPE html>
<html>
<head>
<title>How to add emoji in HTML document?</title>
</head>
<body>
<h4>How to add emoji in HTML document?</h4>
<div>
<p>Devil Emoji: <span>😈</span></p>
<p>Face having Tears of Joy Emoji: <span>😂</span></p>
<p>Thumbs Up Emoji: <span>👍</span></p>
</div>
</body>
</html>
方法 2：使用十进制代码
我们还可以使用表情符号的十进制代码表示形式。这些代码以 &# 开头，以 ; 结尾，就像十六进制代码一样。例如，👀 的十进制代码是 👀。
示例
步骤 1 - 首先，我们将定义基本的 HTML 代码。
<!DOCTYPE html> <html> <head> <title>How to add emoji in HTML document?</title> </head> <body> <h4>How to add emoji in HTML document?</h4> </body> </html>
步骤 2 - 现在，我们将添加表情符号的十进制代码。
<div> <p>Devil Emoji: <span>😈</span></p> <p>Face having Tears of Joy Emoji: <span>😂</span></p> <p>Thumbs Up Emoji: <span>👍</span></p> </div>
以下是完整代码：
<!DOCTYPE html>
<html>
<head>
<title>How to add emoji in HTML document?</title>
</head>
<body>
<h4>How to add emoji in HTML document?</h4>
<div>
<p>Devil Emoji: <span>😈</span></p>
<p>Face having Tears of Joy Emoji: <span>😂</span></p>
<p>Thumbs Up Emoji: <span>👍</span></p>
</div>
</body>
</html>
结论
在本文中，我们了解了如何在 HTML 文档中添加表情符号。我们简要了解了表情符号的两种表示形式，即十六进制代码和十进制代码，我们还了解了如何利用这些表示形式在网页中添加表情符号。
更新于：2023-03-30
3K+ 阅读量
广告