blocks|key|1737649|text|HTML|type|unstyled|depth|inlineStyleRanges|offset|length|style|BOLD|entityRanges|data|1737650|将&#128269;用于🔍，将&#128270;用于🔎|CODE|1737651|CSS+(内容字符串)|1737652|将'\1F50D'用于🔍，将'\1F50E'用于🔎|1737653|正如注释中所指出的，这取决于字体和unicode支持。|1737654|我建议您坚持使用图像或精灵工作表，以确保它得到支持。|1737655|字体更新:+Fonts|1737656|一种新的方法是通过使用特殊的字体框架，它使用web字体和CSS辅助类的组合。一个示例是Font+Awesome+(下面的示例使用search+icon)：|1737657|<i+class="fas+fa-search"+aria-hidden="true">|code-block|syntax|javascript|1737658|使用这种方法的好处是，可以在不改变质量的情况下调整内容的大小，并且像任何其他文本一样受到CSS规则的约束，因此color和text-shadow等规则可以影响它。|1737659|entityMap|0|LINK|mutability|MUTABLE|url|http://fontawesome.io/|1|http://fontawesome.io/icon/search/^0|0|4|0|1|9|F|9|0|0|B|0|1|8|E|8|0|0|0|0|17|C|0|1S|B|1|0|0|1J|5|1P|B|0^^$0|@$1|2|3|4|5|6|7|1B|8|@$9|1C|A|1D|B|C]]|D|@]|E|$]]|$1|F|3|G|5|6|7|1E|8|@$9|1F|A|1G|B|H]|$9|1H|A|1I|B|H]]|D|@]|E|$]]|$1|I|3|J|5|6|7|1J|8|@$9|1K|A|1L|B|C]]|D|@]|E|$]]|$1|K|3|L|5|6|7|1M|8|@$9|1N|A|1O|B|H]|$9|1P|A|1Q|B|H]]|D|@]|E|$]]|$1|M|3|N|5|6|7|1R|8|@]|D|@]|E|$]]|$1|O|3|P|5|6|7|1S|8|@]|D|@]|E|$]]|$1|Q|3|R|5|6|7|1T|8|@]|D|@]|E|$]]|$1|S|3|T|5|6|7|1U|8|@]|D|@$9|1V|A|1W|1|1X]|$9|1Y|A|1Z|1|20]]|E|$]]|$1|U|3|V|5|W|7|21|8|@]|D|@]|E|$X|Y]]|$1|Z|3|10|5|6|7|22|8|@$9|23|A|24|B|H]|$9|25|A|26|B|H]]|D|@]|E|$]]|$1|11|3|-4|5|6|7|27|8|@]|D|@]|E|$]]]|12|$13|$5|14|15|16|E|$17|18]]|19|$5|14|15|16|E|$17|1A]]]]

HTML

Use <code>&amp;#128269;</code> for &#128269; and <code>&amp;#128270;</code> for &#128270;

CSS (content string)

Use <code>'\1F50D'</code> for &#128269; and <code>'\1F50E'</code> for &#128270;

As noted in comments, this depends on font and unicode support.

I suggest you stick with using an image or sprite sheet for this purpose to ensure that it's supported.

Update: Fonts

A new method for this is through the use of special font frameworks, which use a combination of web fonts and CSS helper classes. One example is <a href="http://fontawesome.io/" rel="noreferrer" title="Font Awesome">Font Awesome</a> (the example below uses the <a href="http://fontawesome.io/icon/search/" rel="noreferrer" title="Font Awesome Search Icon">search icon</a>):

<pre><code>&lt;i class="fas fa-search" aria-hidden="true"&gt;&lt;/i&gt;
</code></pre>

Using this method has the benefit of having something that can be resized without a change in quality, as well as being subject to CSS rules like any other text, so rules like <code>color</code> and <code>text-shadow</code> can affect it.

blocks|key|4595951|text|没有任何HTML实体可以被合理地视为表示“搜索图标”。|type|unstyled|depth|inlineStyleRanges|entityRanges|data|4595952|根据您所说的“搜索图标”是什么意思，可能有也可能没有表示它的Unicode字符。参见Is+there+Unicode+glyph+Symbol+to+represent+"Search"。如果有，那么它可以写为HTML中的字符引用，尽管这相当无关紧要；重要的是大多数字体都不包含它。|offset|length|4595953|entityMap|0|LINK|mutability|MUTABLE|url|https://stackoverflow.com/questions/12036038/is-there-unicode-glyph-symbol-to-represent-search^0|0|16|1F|0|0^^$0|@$1|2|3|4|5|6|7|N|8|@]|9|@]|A|$]]|$1|B|3|C|5|6|7|O|8|@]|9|@$D|P|E|Q|1|R]]|A|$]]|$1|F|3|-4|5|6|7|S|8|@]|9|@]|A|$]]]|G|$H|$5|I|J|K|A|$L|M]]]]

There is no HTML entity that could be reasonably regarded as denoting a “search icon”.

Depending on what you mean by “search icon”, there may or may not be a Unicode character that represents it. See <a href="https://stackoverflow.com/questions/12036038/is-there-unicode-glyph-symbol-to-represent-search">Is there Unicode glyph Symbol to represent &quot;Search&quot;</a>. If there is, then it can be written as a character reference in HTML, though this is rather immaterial; the important thing is that most fonts would not contain it.

blocks|key|20346|text|如果只使用css和html呢？这就是我所做的(可以改进)：|type|unstyled|depth|inlineStyleRanges|entityRanges|data|20347|<!DOCTYPE+html>
<html>
++++<head>
++++++++<meta+charset=+"UTF-8">
++++++++<title>+A+css+trick+</title>
++++++++<style+type="text/css">
+++++++++++++body{
++++++++++++background-size:+100%25;+
++++++++++++background-color:+#000;+
++++++++++++color:+orange;
++++++++++++font-size:+18px;
++++++++++++margin:+0+auto;
++++++++++++text-align:+center;+++++++++
++++++++++++}
++++++++++++#search_box{width:+60px;+position:+relative;+margin:+0+auto;+transform:+rotate(26deg)}
++++++++++++#search{width:10px;+height:+10px;+border:+3px+solid+#f5f5f5;+border-radius:+10px;+float:+left;}
++++++++++++#cabe{width:+8px;display:+block;+border:+2px+solid+#fff;color:+#f6f6f6;+font-weight:+bold;+text-shadow:+2px+0px+#fff;+position:+absolute;+top:+6px;+left:+13px;+font-size:+16px;+border-radius:+10px;}

++++++++</style>+
++++</head>
++++<body>
++++++++<h1>CSS+TRICK</h1>
++++++++<div+id="search_box"><div+id="search"></div><span+id="cabe"></div>

++++</body>++

</html>|code-block|syntax|javascript|20348|entityMap^0|0|0^^$0|@$1|2|3|4|5|6|7|I|8|@]|9|@]|A|$]]|$1|B|3|C|5|D|7|J|8|@]|9|@]|A|$E|F]]|$1|G|3|-4|5|6|7|K|8|@]|9|@]|A|$]]]|H|$]]

How about using css and html only? This is what I did (can be improved): 

<pre><code>&lt;!DOCTYPE html&gt;
&lt;html&gt;
 &lt;head&gt;
 &lt;meta charset= "UTF-8"&gt;
 &lt;title&gt; A css trick &lt;/title&gt;
 &lt;style type="text/css"&gt;
 body{
 background-size: 100%; 
 background-color: #000; 
 color: orange;
 font-size: 18px;
 margin: 0 auto;
 text-align: center; 
 }
 #search_box{width: 60px; position: relative; margin: 0 auto; transform: rotate(26deg)}
 #search{width:10px; height: 10px; border: 3px solid #f5f5f5; border-radius: 10px; float: left;}
 #cabe{width: 8px;display: block; border: 2px solid #fff;color: #f6f6f6; font-weight: bold; text-shadow: 2px 0px #fff; position: absolute; top: 6px; left: 13px; font-size: 16px; border-radius: 10px;}

 &lt;/style&gt; 
 &lt;/head&gt;
 &lt;body&gt;
 &lt;h1&gt;CSS TRICK&lt;/h1&gt;
 &lt;div id="search_box"&gt;&lt;div id="search"&gt;&lt;/div&gt;&lt;span id="cabe"&gt;&lt;/span&gt;&lt;/div&gt;

 &lt;/body&gt; 

&lt;/html&gt;
</code></pre>

I'm trying to put a search icon in the navigation bar of my webpage but I'm not willing to use image for the purpose. Is there a HTML entity for a search icon used in search engines or search bars in different websites. I know most of them use images but is there any HTML entity for it? 

Thanks in advance. 

EDIT: I am providing the code

<pre><code>&lt;li&gt;&lt;a href="#search"&gt; **SearchIconEntityToPutHere** &lt;/a&gt;
 &lt;ul&gt;
 &lt;li&gt;&lt;form id="searchbar"&gt;
 &lt;input type="text"&gt;
 &lt;/form&gt;&lt;/li&gt;
 &lt;/ul&gt;
&lt;/li&gt;
</code></pre>

What is the HTML entity for a search icon?

翻译质量差，导致语言生硬或混乱。

没有提供实际的解决方法或示例。

解答不清晰，无法理解或解决问题。

页面排版不美观，阅读体验差。

文章

问答

视频

学习中心

腾讯云实验室

直播

竞赛

腾讯云代码分析专区

腾讯iOA零信任安全管理系统专区

腾讯云架构师技术同盟交流圈

腾讯云数据库专区

腾讯云顾问专区

腾讯云原生专区

腾讯混元专区

腾讯云TCE专区

腾讯云Lighthouse专区

腾讯云HAI专区

腾讯云Edgeone专区

腾讯云存储专区

腾讯云智能专区

腾讯轻联专区 

腾讯云开发专区

TAPD专区

腾讯轻量云游戏服专区

腾讯云最具价值专家

腾讯云架构师技术同盟

腾讯云创作之星

腾讯云开发者先锋

腾讯云代码助手

云原生构建

TAPD 敏捷项目管理

Cloud Studio

SDK中心

API中心

命令行工具

涵盖代码开发、场景应用、自动测试全流程，助你从零构建专属AI助手

一站式MCP教程库，解锁AI应用新玩法

我正试着在我网页的导航栏里放一个搜索图标，但我不愿意使用图片。在不同网站的搜索引擎或搜索栏中使用的搜索图标是否有HTML实体。我知道他们中的大多数都使用图片，但是有没有HTML实体来支持它呢？提前谢谢。编辑:我提供了代码<li><a href="#search"> **SearchIconEntityToPutHere...

问搜索图标的HTML实体是什么？
EN

Stack Overflow用户

社区

活动

圈层

关于

腾讯云开发者

热门产品

热门推荐

更多推荐

问搜索图标的HTML实体是什么？EN