HTML 字符实体 <(<)、>(>)等

本文讲解了HTML中字符实体的使用,如小于号和不间断空格的正确表示,并对比了SQL中比较运算符的编码方法。还提供了SQL中的不等号、大于等于和小于等于操作的实例。
该文章已生成可运行项目,

一、概述

在 HTML 中,某些字符是预留的。 在 HTML 中不能使用小于号(<)和大于号(>),这是因为浏览器会误认为它们是标签。 如果希望正确地显示预留字符,我们必须在 HTML 源代码中使用字符实体(character entities)。字符实体类似如下:

&entity_name;
或者
&#entity_number;

如需显示小于号,我们必须这样写:&lt;&#60;

注意:
使用实体名而不是数字的好处是,名称易于记忆。不过坏处是,浏览器也许并不支持所有实体名称(对实体数字的支持却很好)。

二、不间断空格(non-breaking space)

HTML 中的常用字符实体是不间断空格( )。 浏览器总是会截短 HTML 页面中的空格。如果在文本中写 10 个空格,在显示该页面之前,浏览器会删除它们中的 9 个。如需在页面中增加空格的数量,需要使用   字符实体。

HTML 中有用的字符实体:

实体名称对大小写敏感

三、sql 中大于等于小于的写法

1️⃣小于等于 a<=b
a <= b
a <![CDATA[<= ]]>b

2️⃣大于等于 a>=b
a >= b
a <![CDATA[>= ]]>b

3️⃣不等于 a!=b
a <![CDATA[ <> ]]>b
a <![CDATA[!= ]]>b

例子:

<if test="provinceId != null"> 
AND <![CDATA[ province_id = #{provinceId} ]]> 
</if> 
<if test="id != null"> 
AND <![CDATA[ id <> #{id} ]]> 
</if>
该文章已生成可运行项目
文档是一个接口的返回结果,如何判断是否返回与下面的字符一致&lt;!DOCTYPE html&gt;\n&lt;html&gt;\n&lt;head&gt;\n &lt;meta charset=\"utf-8\"&gt;\n &lt;meta http-equiv=\"content-type\" content=\"text/html; charset=utf-8\"&gt;\n &lt;meta http-equiv=\"X-UA-Compatible\" content=\"IE=Edge\"&gt;\n &lt;meta name=\"viewport\" content=\"width=device-width, initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0, user-scalable=no\"&gt;\n &lt;meta name=\"apple-mobile-web-app-status-bar-style\" content=\"black\"&gt;\n &lt;meta content=\"yes\" name=\"apple-mobile-web-app-capable\"&gt;\n &lt;meta content=\"black\" name=\"apple-mobile-web-app-status-bar-style\"&gt;\n &lt;meta content=\"telephone=no\" name=\"format-detection\"&gt;\n &lt;meta content=\"email=no\" name=\"format-detection\"&gt;\n &lt;meta name=\"report\" content='{\"pid\": \"blog\", \"spm\":\"1001.2101\"}'&gt;\n &lt;meta name=\"applicable-device\" content=\"mobile\"&gt;\n &lt;meta http-equiv=\"Cache-Control\" content=\"no-transform\" /&gt;\n &lt;meta http-equiv=\"Cache-Control\" content=\"no-siteapp\" /&gt;\n &lt;meta name=\"csdn-baidu-search\" content='{\"autorun\":true,\"install\":true,\"keyword\":\"富文本test\"}'&gt;\n &lt;meta name=\"referrer\" content=\"always\"&gt;\n &lt;title&gt;富文本test - CSDN博客&lt;/title&gt;\n &lt;link href=\"https://g.csdnimg.cn/static/logo/favicon32.ico\" rel=\"shortcut icon\" type=\"image/x-icon\" /&gt;\n &lt;link rel=\"stylesheet\" href=\"https://csdnimg.cn/release/blogv2/dist/app/css/app_detail_enter-055a9826b5.min.css\"/&gt;\n &lt;style&gt;\n .MathJax_Preview{\n display: none !important;\n }\n &lt;/style&gt;\n &lt;script&gt;\n initpage();\n window.onresize = initpage;\n function initpage(){\n var view_width = document.getElementsByTagName('html&#39;)[0].getBoundingClientRect().width;\n var _html = document.getElementsByTagName('html&#39;)[0];\n window.fontSize = view_width&gt;750?750/7.5:view_width/7.5;\n _html.style.fontSize= window.fontSize+'px';\n }\n &lt;/script&gt;\n &lt;script&gt;\n var isBlackSkin = false;\n var isApp = true;\n window.csdn = window.csdn ? window.csdn : {};\n window.csdn.toolbarIsBlack = isBlackSkin\n var username = \"cpongo13\";\n var blogShopInIt = true;\n var blogStaticHost = \"https://csdnimg.cn/release/blogv2/\";\n var articleId = \"151363106\";\n var blogUrl = \"https://blog.csdn.net/\";\n //baidu js \n var blogTitle = \"富文本test\";\n var baiduKey = \"富文本test\";\n\n var needInsertBaidu = false;\n var recommendRegularDomainArr = [\"blog.csdn.net/.+/article/details/\",\"download.csdn.net/download/\",\"edu.csdn.net/course/detail/\",\"ask.csdn.net/questions/\",\"bbs.csdn.net/topics/\",\"www.csdn.net/gather_.+/\"];\n var currentUrl = \"https://blog.csdn.net/cpongo13/article/details/151363106\";\n var baiduCount = 0;\n var isBaiduPre = false;\n var highlight = [\"test\",\"富文本\"];\n var baiduSearchType = \"title\";\n var articleSource = 1;\n //baidujs\n var apprewad = false;\n var blogShopVersion = '';\n var baiduSearchChannel = 'app_relevant'\n var baiduSearchIdentification = ''\n var distRequestId = '1757490097863_05439'\n var recommendListArr = []\n window.nextArticleUrl = ''\n recommendListArr.push('https://blog.csdn.net/weixin_28759829/article/details/112906049&#39;)\n recommendListArr.push('https://blog.csdn.net/weixin_42561476/article/details/117916767&#39;)\n recommendListArr.push('https://blog.csdn.net/ZH445063477/article/details/125165435&#39;)\n recommendListArr.push('https://blog.csdn.net/weixin_31100705/article/details/113153212&#39;)\n recommendListArr.push('https://blog.csdn.net/weixin_39836726/article/details/114211678&#39;)\n var isEnterprise = false;\n if (recommendListArr.length) {\n if (recommendListArr.length &gt;= 5) {\n window.nextArticleUrl = recommendListArr[parseInt(Math.random() * 5)]\n } else{\n window.nextArticleUrl = recommendListArr[parseInt(Math.random() * recommendListArr.length)]\n }\n }\n var privateData = [];\n var privateEduData = [];\n var isGitCodeBlog = false;\n var isOpenSourceBlog = false;\n &lt;/script&gt;\n&lt;/head&gt;\n&lt;body class=\"\"&gt;\n &lt;!-- flowchart 箭头图标 勿删 --&gt;\n &lt;svg xmlns=\"http://www.w3.org/2000/svg\" style=\"display: none;\"&gt;&lt;path stroke-linecap=\"round\" d=\"M5,0 0,2.5 5,5z\" id=\"raphael-marker-block\" style=\"-webkit-tap-highlight-color: rgba(0, 0, 0, 0);\"&gt;&lt;/path&gt;&lt;/svg&gt;\n &lt;div class=\"article_content \"&gt;\n &lt;link rel=\"stylesheet\" href=\"https://csdnimg.cn/release/blogv2/dist/mobile/css/edit_views_html-db03dd5f8c.min.css\"/&gt;\n &lt;link rel=\"stylesheet\" href=\"https://csdnimg.cn/release/blogv2/dist/mdeditor/css/editerView/ck_htmledit_views-10bf609291.css\" /&gt;\n &lt;div id=\"content_views\" class=\"htmledit_views edit_views clearfix \"&gt;\n &lt;div class=\"article_top_msg_box\"&gt;\n &lt;/div&gt;\n &lt;h4&gt;富文本test&lt;/h4&gt; \n&lt;p&gt;以下是一篇包含多种富文本功能的测试文章,可用于验证富文本编辑器的各项功能。&lt;/p&gt; \n&lt;hr /&gt; \n&lt;p&gt;&lt;strong&gt;标题示例:富文本功能测试&lt;/strong&gt;&lt;/p&gt; \n&lt;p&gt;&lt;em&gt;斜体文本&lt;/em&gt;&lt;br /&gt; &lt;strong&gt;粗体文本&lt;/strong&gt;&lt;br /&gt; &lt;em&gt;&lt;strong&gt;粗斜体文本&lt;/strong&gt;&lt;/em&gt;&lt;br /&gt; &lt;s&gt;删除线文本&lt;/s&gt;&lt;br /&gt; &lt;u&gt;下划线文本&lt;/u&gt;&lt;br /&gt; &lt;code&gt;行内代码&lt;/code&gt;&lt;/p&gt; \n&lt;hr /&gt; \n&lt;h4&gt;段落与对齐&lt;/h4&gt; \n&lt;p&gt;左对齐段落:&lt;br /&gt; 这是一个普通的左对齐段落,用于测试富文本的基本段落功能。&lt;/p&gt; \n&lt;p&gt;居中段落:&lt;br /&gt; &lt;p style="text-align:center"&gt;这是一个居中对齐的段落,通常用于标题或强调内容。&lt;/p&gt;&lt;/p&gt; \n&lt;p&gt;右对齐段落:&lt;br /&gt; &lt;p style="text-align:right"&gt;这是一个右对齐的段落,适合签名或日期。&lt;/p&gt;&lt;/p&gt; \n&lt;hr /&gt; \n&lt;h4&gt;列表功能&lt;/h4&gt; \n&lt;p&gt;无序列表:&lt;/p&gt; \n&lt;ul&gt;&lt;li&gt;项目一&lt;/li&gt;&lt;li&gt;项目二 \n &lt;ul&gt;&lt;li&gt;子项目一&lt;/li&gt;&lt;li&gt;子项目二&lt;/li&gt;&lt;/ul&gt; &lt;/li&gt;&lt;li&gt;项目三&lt;/li&gt;&lt;/ul&gt; \n&lt;p&gt;有序列表:&lt;/p&gt; \n&lt;ol&gt;&lt;li&gt;第一项&lt;/li&gt;&lt;li&gt;第二项 \n &lt;ol&gt;&lt;li&gt;嵌套项&lt;/li&gt;&lt;li&gt;嵌套项&lt;/li&gt;&lt;/ol&gt; &lt;/li&gt;&lt;li&gt;第三项&lt;/li&gt;&lt;/ol&gt; \n&lt;p&gt;任务列表:&lt;/p&gt; \n&lt;ul&gt;&lt;li&gt;[x] 已完成任务&lt;/li&gt;&lt;li&gt;[ ] 未完成任务&lt;/li&gt;&lt;li&gt;[ ] 另一个任务&lt;/li&gt;&lt;/ul&gt; \n&lt;hr /&gt; \n&lt;h4&gt;链接与图片&lt;/h4&gt; \n&lt;p&gt;&lt;span style=\"outline-color:currentcolor; outline-style:none\" tabindex=\"-1\"&gt;&lt;a href=\"https://example.com/\" target=\"_blank\" title=\"这是一个超链接示例\" rel=\"nofollow noopener noreferrer\"&gt;这是一个超链接示例&lt;/a&gt;&lt;/span&gt;&lt;/p&gt; \n&lt;p&gt;&lt;img src=\"https://img-home.csdnimg.cn/images/20230724024159.png?origin_url=https%3A%2F%2Fvia.placeholder.com%2F150&pos_id=HuY5V0Vi\" /&gt;&lt;/p&gt; \n&lt;hr /&gt; \n&lt;h4&gt;表格功能&lt;/h4&gt; \n&lt;table&gt;&lt;thead&gt;&lt;tr&gt;&lt;th&gt;列1&lt;/th&gt;&lt;th&gt;列2&lt;/th&gt;&lt;th&gt;列3&lt;/th&gt;&lt;/tr&gt;&lt;/thead&gt;&lt;tbody&gt;&lt;tr&gt;&lt;td&gt;单元格1&lt;/td&gt;&lt;td&gt;单元格2&lt;/td&gt;&lt;td&gt;单元格3&lt;/td&gt;&lt;/tr&gt;&lt;tr&gt;&lt;td&gt;&lt;em&gt;斜体&lt;/em&gt;&lt;/td&gt;&lt;td&gt;&lt;strong&gt;粗体&lt;/strong&gt;&lt;/td&gt;&lt;td&gt;&lt;s&gt;删除线&lt;/s&gt;&lt;/td&gt;&lt;/tr&gt;&lt;tr&gt;&lt;td&gt;左对齐&lt;/td&gt;&lt;td&gt;居中&lt;/td&gt;&lt;td&gt;右对齐&lt;/td&gt;&lt;/tr&gt;&lt;/tbody&gt;&lt;/table&gt; \n&lt;hr /&gt; \n&lt;h4&gt;代码块&lt;/h4&gt; \n&lt;pre&gt;\n &lt;/pre&gt; \n&lt;p&gt&lt;/p&gt; \n&lt;pre&gt;\n &lt;/pre&gt; \n&lt;p&gt;&lt;img src=\"data:image/gif;base64,R0lGODlhAQABAPABAP///wAAACH5BAEKAAAALAAAAAABAAEAAAICRAEAOw==\" /&gt;&lt;/p&gt; \n&lt;p&gt&lt;/p&gt; \n&lt;hr /&gt; \n&lt;h4&gt;引用与分割线&lt;/h4&gt; \n&lt;blockquote&gt; \n &lt;p&gt&lt;/p&gt; \n&lt;/blockquote&gt; \n&lt;hr /&gt; \n&lt;h4&gt;嵌入内容&lt;/h4&gt; \n&lt;p&gt;&lt;iframe width="560" height="315" src="https://www.youtube.com/embed/dQw4w9WgXcQ" frameborder="0" allowfullscreen&gt;&lt;/iframe&gt;&lt;/p&gt; \n&lt;hr /&gt; \n&lt;h4&gt;数学公式&lt;/h4&gt; \n&lt;p&gt;行内公式:$E=mc^2$&lt;/p&gt; \n&lt;p&gt;独立公式: $$ \\sum_{i=1}^n i = \\frac{n(n+1)}{2} $$&lt;/p&gt; \n&lt;hr /&gt; \n&lt;h4&gt;特殊字符HTML&lt;/h4&gt; \n&lt;p&gt;HTML实体:© ™ ®&lt;/p&gt; \n&lt;p&gt;直接嵌入HTML&lt;span style="color:red"&gt;红色文本&lt;/span&gt;&lt;/p&gt; \n&lt;hr /&gt; \n&lt;h4&gt;其他格式&lt;/h4&gt; \n&lt;p&gt;上标示例:x&lt;sup&gt;2&lt;/sup&gt;&lt;br /&gt; 下标示例:H&lt;sub&gt;2&lt;/sub&gt;O&lt;/p&gt; \n&lt;p&gt;高亮文本:&lt;mark&gt;高亮内容&lt;/mark&gt;&lt;/p&gt; \n&lt;hr /&gt; \n&lt;p&gt;这篇测试文章涵盖了富文本编辑器的主要功能,包括文本样式、段落、列表、表格、代码、嵌入内容等,可用于全面验证富文本支持的完整性。
最新发布
09-11
评论 3
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包

打赏作者

JFS_Study

你的鼓励将是我创作的最大动力

¥1 ¥2 ¥4 ¥6 ¥10 ¥20
扫码支付:¥1
获取中
扫码支付

您的余额不足,请更换扫码支付或充值

打赏作者

实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值