表示“对钩”,“叉号”的特殊转义符号汇总:

对钩符号 编码 描述 叉号符号 编码 描述
CHECK MARK 手写体对钩(细) BALLOT X 手写体叉号(细)
HEAVY CHECK MARK 手写体对钩(粗) HEAVY BALLOT X 手写体叉号(加粗)
√ 或 √ √ SQUARE ROOT 平方根、常用于表示对钩符号 × × 倍数乘号、常用于表示错误符号
BALLOT BOX WITH CHECK 方框对钩 BALLOT BOX WITH X 方框叉号
BALLOT BOX 选项 空方框 / 投票箱
WHITE HEAVY CHECK MARK 白色粗复选标记 NEGATIVE SQUARED CROSS MARK 负平方十字标记
十六进制:✕ 示例:content: '\2715'; MULTIPLICATION X 乘法X
HEAVY MULTIPLICATION X 乘法X (加粗)
SALTIRE、X形十字图记
CROSSING LANES、过街车道
CROSS MARK、十字标记
SQUARED SALTIRE 方框X形十字
圆圈叉号,常用于表示禁止、异常提示
⊗ 圆圈叉号,常用于表示禁止、异常提示

表示“选项”(方框符号、圆框符号)的特殊转义符号汇总:

方框符号 编码 描述 圆框符号 编码 描述
BALLOT BOX 空白方框 LARGE CIRCLE 大圆圈
SQUARE FOUR CORNERS 方形四角,空白虚线方框
FALLING DIAGONAL IN WHITE CIRCLE IN BLACK SQUARE 黑色方块中白色圆圈中的下降对角线
SHADOWED WHITE CIRCLE 阴影白色圆圈
MEDIUM SMALL WHITE CIRCLE 中小型白色圆圈
MEDIUM BLACK CIRCLE 中黑色圆圈,实体填充圆圈
MEDIUM WHITE CIRCLE 中白色圆圈,镂空中空圆圈
NO ENTRY 禁行
红色圆圈
镂空中空方框
实体填充方框
WHITE MEDIUM SQUARE 白色中方形
BLACK MEDIUM SQUARE 黑色中方形
WHITE MEDIUM SMALL SQUARE 白色中小正方形
BLACK MEDIUM SMALL SQUARE 黑色中小正方形

表示“五角星”的特殊转义符号汇总:

特殊符号 编码 描述 示例
STAR OPERATOR 星形操作员 ⋆、⋆
BLACK STAR 黑色五角星,实体填充五角星 ★、★
WHITE STAR 白色五角星,镂空中空五角星 ☆、☆
OUTLINED WHITE STAR 五角星形,轮廓白色星形 ⚝、⚝
STAR OF DAVID 五角星形,大卫之星 ✡、✡
PENTAGRAM 五角星形,镂空中空五角星 ⛤、⛤
RIGHT-HANDED INTERLACED PENTAGRAM 右手交错五角星,镂空中空五角星 ⛥、⛥
LEFT-HANDED INTERLACED PENTAGRAM 左手交错五角星,镂空中空五角星 ⛦、⛦
INVERTED PENTAGRAM 倒五角星形,镂空中空倒五角星 ⛧、⛧
STRESS OUTLINED WHITE STAR 应力轮廓白星,镂空中空应力轮廓白星 ✩、✩
CIRCLED WHITE STAR 带圆圈的白色恒星 ✪、✪
OPEN CENTRE BLACK STAR 开心黑星 ✫、✫
BLACK CENTRE WHITE STAR 黑中心白星 ✬、✬
OUTLINED BLACK STAR 轮廓黑星 ✭、✭
HEAVY OUTLINED BLACK STAR 粗轮廓黑星 ✮、✮
PINWHEEL STAR 针轮星形 ✯、✯
SHADOWED WHITE STAR 阴影白色恒星 ✰、✰
实体填充五角星(黄色)

表示“心”的特殊转义符号汇总:

特殊符号 编码 描述 特殊符号 编码 描述
WHITE HEART SUIT 白色心形,镂空中空心形。示例:♡、♡ BLACK HEART SUIT 黑色心形,实体填充心形。示例:、
HEAVY BLACK HEART 黑色心形 (加粗),实体填充黑色心形 (加粗)。示例:、 🖤
💓 💔
💕 💖
💗 💘
💙 💚
💛 💜
💝 💞

表示“大拇指”的特殊转义符号汇总:

特殊符号 编码 特殊符号 编码
👍 👍
👎 👎

表示“旗子”的特殊转义符号汇总:

特殊符号 编码 描述 示例
WHITE FLAG 白色旗子,镂空中空旗子形
BLACK FLAG 黑色旗子,实体填充旗子形 ⚑、⚑、⚑、⚑、⚑、⚑、⚑、⚑、⚑、⚑、⚑、⚑、⚑、⚑、⚑、⚑、⚑、⚑、⚑、⚑、⚑
🏳
🏴

表示“十二生肖”,“十二星座”的特殊转义符号汇总:

十二生肖 编码 描述 十二星座 编码 描述
鼠: 🐀🐁🐭 水瓶座:1.20-2.18 AQUARIUS
牛: 🐂🐃🐄🐮 双鱼座:2.19-3.20 PISCES
虎: 🐅🐆🐯 白羊座:3.21-4.19 ARIES
兔: 🐇🐰 金牛座:4.20-5.20 TAURUS
龙: 🐉🐲 双子座:5.21-6.21 GEMINI
蛇: 🐍 巨蟹座:6.22-7.22 CANCER
马: 🐎🐴 狮子座:7.23-8.22 LEO
羊: 🐏🐐🐑 处女座:8.23-9.22 VIRGO
猴: 🐒🐵 天秤座:9.23-10.23 LIBRA
鸡: 🐓🐔 天蝎座:10.24-11.22 SCORPIUS
狗: 🐕🐶 射手座:11.23-12.21 SAGITTARIUS
猪: 🐖🐗🐷 摩羯座:12.22-1.19 CAPRICORN

其他常用的特殊转义符号汇总:

特殊符号 编码 特殊符号 编码
钻石: 💎 水: 火: Water:💦 💧 Fire:🔥
18禁: 🔞💡🔔 眼睛/眼镜:、 👁🕶
飞机:
设置/工具: ⚒ ⛭ ⛮ ⛯ ⚙ 🛠 金牌: 银牌: 铜牌:
金牌:、银牌:、铜牌:
🥇🥈🥉🎖
电话: ☏ ✆ 📞 邮箱/Email: 📧
消息: 💬💭🗨
标签:、⚚ 🏷
文件夹: 📁📂 世界地图(大陆): 🗺
左尖括号:❬ ❮ ❰ ≪ UTF-8 Dingbats 右尖括号:❭ ❯ ❱ ≫
方框图(斜线):╱ ∕ 方框图(斜线):╲ ∖

眼睛:明文/密文:

<style>
.eye-ban {
font-size: xx-large;
position: relative;
}
.eye-ban:before {
content: "\2571";
color: #40a9ff;
position: absolute;
}
</style> <span class="eye-ban">👁</span>

世界地图:

参考链接:

【w3school】HTML 符号

【w3school】UTF-8 货币符号

【w3school】UTF-8 数学运算符

【w3school】UTF-8 杂项符号

【w3school】HTML 4 实体名称


【w3school】Emoji Unicode 参考手册

【w3school】笑脸表情符号

【w3school】Emoji 肤色


Html特殊字符表

HTML/XML转义字符对照表

常用特殊符号大全2019版


常用的SVG图标:

表示“五角星”的SVG图标(常用于标识“收藏”):

代码:

<style type="text/css">
<!-- CSS样式 -->
.star {
color: #FFD700;
border-color: #FFD700;
background: #fff;
}
</style> <div class="star">
<!-- 空心五角星 -->
<svg viewBox="64 64 896 896" focusable="false" data-icon="star" width="1.5rem" height="1.5rem" fill="currentColor" aria-hidden="true"><path d="M908.1 353.1l-253.9-36.9L540.7 86.1c-3.1-6.3-8.2-11.4-14.5-14.5-15.8-7.8-35-1.3-42.9 14.5L369.8 316.2l-253.9 36.9c-7 1-13.4 4.3-18.3 9.3a32.05 32.05 0 00.6 45.3l183.7 179.1-43.4 252.9a31.95 31.95 0 0046.4 33.7L512 754l227.1 119.4c6.2 3.3 13.4 4.4 20.3 3.2 17.4-3 29.1-19.5 26.1-36.9l-43.4-252.9 183.7-179.1c5-4.9 8.3-11.3 9.3-18.3 2.7-17.5-9.5-33.7-27-36.3zM664.8 561.6l36.1 210.3L512 672.7 323.1 772l36.1-210.3-152.8-149L417.6 382 512 190.7 606.4 382l211.2 30.7-152.8 148.9z"></path></svg>
<!-- 实心五角星 -->
<svg viewBox="64 64 896 896" focusable="false" data-icon="star" width="1.5rem" height="1.5rem" fill="currentColor" aria-hidden="true"><path d="M908.1 353.1l-253.9-36.9L540.7 86.1c-3.1-6.3-8.2-11.4-14.5-14.5-15.8-7.8-35-1.3-42.9 14.5L369.8 316.2l-253.9 36.9c-7 1-13.4 4.3-18.3 9.3a32.05 32.05 0 00.6 45.3l183.7 179.1-43.4 252.9a31.95 31.95 0 0046.4 33.7L512 754l227.1 119.4c6.2 3.3 13.4 4.4 20.3 3.2 17.4-3 29.1-19.5 26.1-36.9l-43.4-252.9 183.7-179.1c5-4.9 8.3-11.3 9.3-18.3 2.7-17.5-9.5-33.7-27-36.3z"></path></svg>
</div>

表示“眼睛/闭合眼睛”的SVG图标(常用于标识“明文/非明文”):

代码:

<div class="eye">
<!-- 眼睛 -->
<svg viewBox="64 64 896 896" focusable="false" data-icon="eye" width="2rem" height="2rem" fill="currentColor" aria-hidden="true"><path d="M942.2 486.2C847.4 286.5 704.1 186 512 186c-192.2 0-335.4 100.5-430.2 300.3a60.3 60.3 0 000 51.5C176.6 737.5 319.9 838 512 838c192.2 0 335.4-100.5 430.2-300.3 7.7-16.2 7.7-35 0-51.5zM512 766c-161.3 0-279.4-81.8-362.7-254C232.6 339.8 350.7 258 512 258c161.3 0 279.4 81.8 362.7 254C791.5 684.2 673.4 766 512 766zm-4-430c-97.2 0-176 78.8-176 176s78.8 176 176 176 176-78.8 176-176-78.8-176-176-176zm0 288c-61.9 0-112-50.1-112-112s50.1-112 112-112 112 50.1 112 112-50.1 112-112 112z"></path></svg>
<!-- 闭合眼睛 -->
<svg viewBox="64 64 896 896" focusable="false" data-icon="eye-invisible" width="2rem" height="2rem" fill="currentColor" aria-hidden="true"><path d="M942.2 486.2Q889.47 375.11 816.7 305l-50.88 50.88C807.31 395.53 843.45 447.4 874.7 512 791.5 684.2 673.4 766 512 766q-72.67 0-133.87-22.38L323 798.75Q408 838 512 838q288.3 0 430.2-300.3a60.29 60.29 0 000-51.5zm-63.57-320.64L836 122.88a8 8 0 00-11.32 0L715.31 232.2Q624.86 186 512 186q-288.3 0-430.2 300.3a60.3 60.3 0 000 51.5q56.69 119.4 136.5 191.41L112.48 835a8 8 0 000 11.31L155.17 889a8 8 0 0011.31 0l712.15-712.12a8 8 0 000-11.32zM149.3 512C232.6 339.8 350.7 258 512 258c54.54 0 104.13 9.36 149.12 28.39l-70.3 70.3a176 176 0 00-238.13 238.13l-83.42 83.42C223.1 637.49 183.3 582.28 149.3 512zm246.7 0a112.11 112.11 0 01146.2-106.69L401.31 546.2A112 112 0 01396 512z"></path><path d="M508 624c-3.46 0-6.87-.16-10.25-.47l-52.82 52.82a176.09 176.09 0 00227.42-227.42l-52.82 52.82c.31 3.38.47 6.79.47 10.25a111.94 111.94 0 01-112 112z"></path></svg>
<div>

表示“放大镜”的SVG图标(常用于标识“搜索框”):(这里样式没有体现出来 o(╥﹏╥)o )

搜索

HTML代码:

<style type="text/css">
<!-- CSS样式 -->
.input-search-group {
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
box-sizing: border-box;
margin: 0;
padding: 0;
color: rgba(0, 0, 0, .85);
font-size: 14px;
font-variant: tabular-nums;
line-height: 1.5715;
list-style: none;
-webkit-font-feature-settings: "tnum", "tnum";
-moz-font-feature-settings: "tnum", "tnum";
font-feature-settings: "tnum", "tnum";
position: relative;
display: flex;
width: 100%;
border-collapse: separate;
border-spacing: 0;
}
.input-search-group .input,.input-search-group .btn {
float: left;
width: 100%;
margin-bottom: 0;
text-align: inherit;
}
.input-search-group .input{
border: 1px solid #d9d9d9;
outline: none;
transition: border-color 0.3s;
}
.input-search-group .input:focus,
.input-search-group .input:hover,
.input-search-group .input:active {
color: #000;
border-color: #40a9ff;
box-shadow: 0 0 8px rgba(74, 144, 226, 0.5);
}
.input-search-group>.input:first-child {
border-top-right-radius: 0;
border-bottom-right-radius: 0;
border-right: none;
}
.input-search-group>.btn:last-child {
border-top-left-radius: 0;
border-bottom-left-radius: 0;
}
.input-search-group .btn {width: 26%;max-width: 40%;} .btn {
position: relative;
display: inline-block;
white-space: nowrap;
text-align: center;
align-items: center;
justify-content: center;
vertical-align: middle;
background-image: none;
-webkit-box-shadow: 0 2px 0 rgba(0, 0, 0, .015);
box-shadow: 0 2px 0 rgba(0, 0, 0, .015);
cursor: pointer;
text-decoration: none;
-webkit-transition: all .3s cubic-bezier(.645, .045, .355, 1);
transition: all .3s cubic-bezier(.645, .045, .355, 1);
-webkit-user-select: none;
-moz-user-select: none;
-ms-user-select: none;
user-select: none;
touch-action: manipulation;
/* height: 32px; */
line-height: 32px;
padding: 4px 15px;
font-size: 14px;
font-weight: 400;
border-radius: 2px;
color: rgba(0, 0, 0, .85);
border: 1px solid #d9d9d9;
background: #fff;
} .btn .anticon {
-webkit-transition: margin-left .3s cubic-bezier(.645, .045, .355, 1);
transition: margin-left .3s cubic-bezier(.645, .045, .355, 1);
} .btn>.anticon {
line-height: 1;
} .btn>span {
display: inline-block;
} .anticon {
display: inline-block;
color: inherit;
font-style: normal;
line-height: 0;
text-align: center;
text-transform: none;
vertical-align: -.125em;
text-rendering: optimizelegibility;
-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale;
} .btn-default {
color: #fff;
border-color: #1890ff;
background: #1890ff;
text-shadow: 0 -1px 0 rgba(0, 0, 0, .12);
-webkit-box-shadow: 0 2px 0 rgba(0, 0, 0, .045);
box-shadow: 0 2px 0 rgba(0, 0, 0, .045);
} .btn-default:focus,
.btn-default:hover,
.btn-default:active {
color: #fff;
border-color: #40a9ff;
background: #40a9ff;
}
</style> <div style="max-width: 300px;">
<span class="input-search-group"><input type="text" placeholder="请输入关键词" class="input"><button type="button" class="btn btn-default"><span role="img" aria-label="search" class="anticon anticon-search"><svg viewBox="64 64 896 896" focusable="false" data-icon="search" width="1em" height="1em" fill="currentColor" aria-hidden="true"><path d="M909.6 854.5L649.9 594.8C690.2 542.7 712 479 712 412c0-80.2-31.3-155.4-87.9-212.1-56.6-56.7-132-87.9-212.1-87.9s-155.5 31.3-212.1 87.9C143.2 256.5 112 331.8 112 412c0 80.1 31.3 155.5 87.9 212.1C256.5 680.8 331.8 712 412 712c67 0 130.6-21.8 182.7-62l259.7 259.6a8.2 8.2 0 0011.6 0l43.6-43.5a8.2 8.2 0 000-11.6zM570.4 570.4C528 612.7 471.8 636 412 636s-116-23.3-158.4-65.6C211.3 528 188 471.8 188 412s23.3-116.1 65.6-158.4C296 211.3 352.2 188 412 188s116.1 23.2 158.4 65.6S636 352.2 636 412s-23.3 116.1-65.6 158.4z"></path></svg></span> 搜索</button></span>
</div>

常见的HTML特殊字符:对钩与叉号,五角星的更多相关文章

  1. eclipse导入项目后出现红色叉号的解决方案

    对于一名程序员来说,我导入的项目在项目的名称上无端加了一个红色的叉号,虽然这个不友好的符号,对于我整个的项目运行没有任何影响,但是总让我觉得不舒服,大大的叉号写在我的项目的脑袋上,我心里能舒服吗?于是 ...

  2. 去掉IE下input的叉号

    IE10下的Input Text和谷歌下面的 input search 一旦输入内容,会在最右端出现一个叉号,点击后,内容就会自动清空,看似方便,其实有些场景并不需要,需要写代码清除掉. 代码如下: ...

  3. jquery ui dialog去掉右上角的叉号

    var dialog = $("#id").dialog({ resizable:false, height:, width:, zIndex:, modal:true, open ...

  4. windows mobile 6.5 隐藏 左下角(左上角)的开始按钮 叉号关闭按钮

    其实做起来很简单,但是国内的网站就是找不到. 1.开始按钮原来的界面是这样的: windows mobile 6.0界面: windows mobile 6.5.X界面: 修改一个windows mo ...

  5. IE10去掉input的type=”text”输入内容时出现的小叉号(X)和type=”password”出现的小眼睛图标

    最近在做一个后台管理系统项目,遇到以下两个问题: 1.从IE 10开始,type="text" 的 input 在用户输入内容后,会自动产生一个小叉号(X),方便用户点击清除已经输 ...

  6. Lodop背景图无图片时显示放大叉号问题

    正常情况下,如果指定图片路径中,图片不存在或指定错误的路径,会因为找不到图片显示叉号,Lodop背景图如果设置了背景图宽度高度控制,显示的叉号也会被相应的放大,形成放大的模糊的图案,看起来就像是黑色边 ...

  7. Excel 2010 对号叉号怎么打出来

    按小键盘数字键:Alt+41420  对号 按小键盘数字键:Alt+41642  叉号 http://jingyan.baidu.com/article/fdbd4277c228cdb89e3f482 ...

  8. 数据结构中很常见的各种树(BST二叉搜索树、AVL平衡二叉树、RBT红黑树、B-树、B+树、B*树)

    数据结构中常见的树(BST二叉搜索树.AVL平衡二叉树.RBT红黑树.B-树.B+树.B*树) 二叉排序树.平衡树.红黑树 红黑树----第四篇:一步一图一代码,一定要让你真正彻底明白红黑树 --- ...

  9. 《Genesis-3D开源游戏引擎-FQA常见问题解答》2014年01月10号版本

    1.Genesis-3D开源游戏引擎主要面向哪些用户人群?有限制吗? 1.我们的引擎没有限制,只要您想了解和使用我们的引擎,就可以加入Genesis-3D的大家庭.2.我们的主要用户群是各个相关的企业 ...

  10. 项目有叉号, 但是没有代码错误的时候, 是JDK版本的问题

    windows---proferences---java--compiler进入项目--properties---java Compiler进入项目--properties---Myeclipse-- ...

随机推荐

  1. 基于Java+SpringBoot+Mysql实现的古诗词平台功能设计与实现十

    一.前言介绍: 1.1 项目摘要 随着信息技术的迅猛发展和数字化时代的到来,传统文化与现代科技的融合已成为一种趋势.古诗词作为中华民族的文化瑰宝,具有深厚的历史底蕴和独特的艺术魅力.然而,在现代社会中 ...

  2. 初步学习Nuxt3

    Nuxt3 用于制作ssr 网页 支持vue3 所有的语法,并且支持了TypeScript, vite+vue3+composition api + ts.SPA单页面应用不能进行SEO优化,SSR应 ...

  3. etcdv3与etcdv2特性比较

    1 客户端通信方式 etcdv3的客户端使用gRPC与server进行通信,通信的消息协议使用protobuf进行约定,代替了v2版本的HTTP-json格式,使用二进制替代文本,更加节省空间. 同时 ...

  4. JAVA并发编程学习笔记之CLH队列锁

    NUMA与SMP SMP(Symmetric Multi-Processor),即对称多处理器结构,指服务器中多个CPU对称工作,每个CPU访问内存地址所需时间相同.其主要特征是共享,包含对CPU,内 ...

  5. 【FAQ】HarmonyOS SDK 闭源开放能力 —Push Kit(6)

    1.问题描述: 推送通知到手机,怎么配置拉起应用指定的页面? 解决方案: 1.如果点击通知栏打开默认Ability的话, actionType可以设置为0, 同时可以在.clickAction.dat ...

  6. offline RL · PbRL | LiRE:构造 A>B>C 的 RLT 列表,得到更多 preference 数据

    论文标题:Listwise Reward Estimation for Offline Preference-based Reinforcement Learning,ICML 2024. arxiv ...

  7. CSS3 transform转换

    1.先说说css的坐标系: x轴的正方向就是水平向右的方向 y轴的正方向就是垂直向下的方向 z轴的正方向就是屏幕到用户的方向 2.位移 说明:位移是转换属性中的一个值,包含2d与3d 属性值 说明 t ...

  8. 修改data数据后页面未更新渲染

    只需添加 this.$forceUpdate() 在修改数据后执行即可 this.$forceUpdate()

  9. 树莓派下,打包发布能在树莓派中运行的Qt5程序和其运行环境

    目标:把Qt程序部署到新的树莓派中. 平台:树莓派 工作:把Qt程序和运行环境分别打包 一.程序打包过程如下,仅供参考: 1.新建文件夹A,把程序拷贝到文件夹中. 2.使用ldd获取依赖关系,并复制到 ...

  10. 【软件配置】使用 brew 安装特定版本软件

    目录 使用 brew 安装特定版本软件 背景 方法一:直接安装 方法二:利用历史的 rb 文件安装 参考资料 使用 brew 安装特定版本软件 背景 brew 是 Mac 下非常好用的包管理工具,可以 ...