极低码 :https://wheart.cn
你是否曾为统计一篇文档的汉字、符号、英文字符数量而头疼?或者在撰写自媒体文章时,需要精确控制字数以满足平台要求?今天给大家介绍一款强大的工具——“文本长度计算器”,它能自动帮你一站式解决所有文字统计难题。
“文本长度计算器”是一款智能化的文本分析软件,具备全面且精准的统计功能。它不仅能快速计算出整个文本的总长度(包括但不限于汉字、英文字母、数字、标点符号和空格),还能细分统计各类字符的数量,让你对每篇文章的构成一目了然。
【核心功能解析】
【实际用途广泛】
子1:(文本内容中的连续空格)
<p>这段文本中,输入连续的空格 大概输入了十个。</p>
显示效果:“格”和“大” 之间的是个空格显示出来只是一个空格。
这段文本中,输入连续的空格 大概输入了十个。
例子2:(代码之间的连续空格)
<span>span是一个行内标签</span> <span>和前面的span元素之间隔了很多个空格</span>
显示效果:两个span元素之间连续的空格,显示出来即"签"与“和”之间的空格,只有一个空格。
span是一个行内标签 和前面的span元素之间隔了很多个空格
上面两个例子证明:HTML代码中连续的空格在显示时会显示为一个空格,其余的多余的空格会被移除或者说被忽略。
段落文本其实也是HTML代码的一部分,只不过它在p标签内部,而例子2的空格是在两个span标签之间。
理解了空格,现在看看空行,同理
例子3:(文本内容中的空行)
<p>这段文本中,输入连续的空行
大概输入了五行。</p>
显示效果:如我们所见,文本代码中的五行空行,显示出来也只是一个空格。
这段文本中,输入连续的空行 大概输入了五行。
例子4:(元素之间/标签之间的空行),只要把例子2中的空格换成空行就可以了,显示效果和例子2的一样,多行空行都只会显示为一个空格。
<span>span是一个行内标签</span>
<span>和前面的span元素之间隔了很多空行</span>
span是一个行内标签 和前面的span元素之间隔了很多空行
得证:HTML 代码中的所有连续的空格或空行(换行)都会被显示为一个空格。
既然如此,如果我们希望扩大两个字符之间的间距,让代码中的连续空格或空行显示出来的结果也是连续的空格或空行,那该怎么办?其实很简单。
方法一:我们可以用预格式化标签<pre>,无论是空格或空行都适用。
<pre>
这是
预格式文本。
它保留了 空格
和换行。
</pre>
显示效果
这是
预格式文本。
它保留了 空格
和换行。
方法二:我们可以用空格实体符 代替空格,用换行标签<br/>代替空行。虽然这种方法可以得到我们想要的显示效果,但是对搜索引擎不是最友好的方式,因为 和<br/>在HTML中都是没有语义的。所以建议尽量少用。另外需要注意的是, 必须小写,而且最后面的分号是不能省略的。
方法三:(适合空格)使用全角空格
全角空格被解释为汉字,所以不会被被解释为HTML分隔符,可以按照实际的空格数显示。
问题:怎么使用全角输入法?
以搜狗输入法为例,我们通常使用的是半角输入,其状态栏中有个月亮的标志,就说明正在使用的是半角输入,如果是太阳的标志,就说明使用的是全角输入。全角/半角的切换可以通过点击标志,也可以通过快捷键 Shift+Space(空格符)切换。
半角输入(月亮)
全角输入(太阳)
方法四:使用CSS样式中字间隔属性控制,CSS中的word-spacing 属性可以改变字(单词)之间的标准间隔。我们知道英文中两个单词之间是通过空格隔开的,所以我们视觉上可以这样认为,word-spacing改变了(拉长或缩短)单词之间那个空格的宽度。
方法五:使用CSS样式中的white-space 属性,这个属性声明如何处理元素内的空白符。
值 | 描述 |
normal | 默认。空白会被浏览器忽略。 |
pre | 空白会被浏览器保留。其行为方式类似 HTML 中的 <pre> 标签。 |
nowrap | 文本不会换行,文本会在在同一行上继续,直到遇到 <br> 标签为止。 |
pre-wrap | 保留空白符序列,但是正常地进行换行。 |
pre-line | 合并空白符序列,但是保留换行符。 |
white-space:normal;就是正常,和不设置一样,连续空格和空行都只会显示一个空格。
white-space:nowrap;不换行是什么意思呢?正常情况下,当我们的文本超出了文本域,文本就会自动折行,这个设置就是说不自动折行了,而是碰到换行标签<br />才换
white-space:pre;和方法一相同,将文本原样输出显示。当文本超出文本域时,不换行,会产生滚动条。
white-space:pre-wrap;保留空格和空行,但当文本超出文本域时,会自动换行。
white-space:pre-line;连续的空格会显示为一个空格,但保留连续的空行。
SS 有几个不同的单位用于表示长度。
一些设置 CSS 长度的属性有 width, margin, padding, font-size, border-width, 等。
长度有一个数字和单位组成如 10px, 2em, 等。
数字与单位之间不能出现空格。如果长度值为 0,则可以省略单位。
对于一些 CSS 属性,长度可以是负数。
有两种类型的长度单位:相对和绝对。
浏览器支持
下表中的数字表示支持该长度单位的最低浏览器版本。
长度单位 | |||||
---|---|---|---|---|---|
em, ex, %, px, cm, mm, in, pt, pc | 1.0 | 3.0 | 1.0 | 1.0 | 3.5 |
ch | 27.0 | 9.0 | 1.0 | 7.0 | 20.0 |
rem | 4.0 | 9.0 | 3.6 | 4.1 | 11.6 |
vh, vw | 20.0 | 9.0 | 19.0 | 6.0 | 20.0 |
vmin | 20.0 | 9.0* | 19.0 | 6.0 | 20.0 |
vmax | 26.0 | 不支持 | 19.0 | 不支持 | 20.0 |
注意: Internet Explorer 9 通过不标准的名称 vm 来支持 vmin 。
相对长度
相对长度单位指定了一个长度相对于另一个长度的属性。对于不同的设备相对长度更适用。
单位 | 描述 | 在线实例 |
---|---|---|
em | 它是描述相对于应用在当前元素的字体尺寸,所以它也是相对长度单位。一般浏览器字体大小默认为16px,则2em == 32px; | 尝试一下 |
ex | 依赖于英文子母小 x 的高度 | 尝试一下 |
ch | 数字 0 的宽度 | |
rem | 根元素(html)的 font-size | |
vw | viewpoint width,视窗宽度,1vw=视窗宽度的1% | 尝试一下 |
vh | viewpoint height,视窗高度,1vh=视窗高度的1% | 尝试一下 |
vmin | vw和vh中较小的那个。 | 尝试一下 |
vmax | vw和vh中较大的那个。 | 尝试一下 |
% |
绝对长度
绝对长度单位是一个固定的值,它反应一个真实的物理尺寸。绝对长度单位视输出介质而定,不依赖于环境(显示器、分辨率、操作系统等)。
提示:
rem与em有什么区别呢?区别在于使用rem为元素设定字体大小时,仍然是相对大小,但相对的只是HTML根元素。单位 | 描述 | 在线实例 |
---|---|---|
cm | 厘米 | 尝试一下 |
mm | 毫米 | 尝试一下 |
in | 英寸 (1in = 96px = 2.54cm) | 尝试一下 |
px * | 像素 (1px = 1/96th of 1in) | 尝试一下 |
pt | point,大约1/72英寸; (1pt = 1/72in) | 尝试一下 |
pc | pica,大约6pt,1/6英寸; (1pc = 12 pt) | 尝试一下 |
像素或许被认为是最好的"设备像素",而这种像素长度和你在显示器上看到的文字屏幕像素无关。px实际上是一个按角度度量的单位。
如您还有不明白的可以在下面与我留言或是与我探讨QQ群308855039,我们一起飞!
*请认真填写需求信息,我们会在24小时内与您取得联系。