美文网首页css我爱编程
字间隔Vs字母间隔

字间隔Vs字母间隔

作者: Lia代码猪崽 | 来源:发表于2018-06-11 12:03 被阅读31次

一、字间隔

word-spacing 属性可以改变字(单词)之间的标准间隔。其默认值 normal 与设置值为 0 是一样的。

word-spacing 属性接受一个正长度值或负长度值。
如果提供一个正长度值,那么字之间的间隔就会增加
为 word-spacing 设置一个负值,会把它拉近

<html>
<head>
<style type="text/css">
p.spread {word-spacing: 30px;}
p.tight {word-spacing: -0.5em;}
</style>
</head>

<body>
<p class="spread">This is some text. This is some text.</p>
<p class="tight">This is some text. This is some text.</p>
</body>
</html>

二、字母间隔

letter-spacing 属性与 word-spacing 的区别在于,字母间隔修改的是字符或字母之间的间隔。

word-spacing 属性一样,letter-spacing 属性的可取值包括所有长度。
默认关键字是 normal(这与 letter-spacing:0 相同)。
输入的长度值会使字母之间的间隔增加减少指定的量:

<html>

<head>
<style type="text/css">
h1 {letter-spacing: -0.5em}
h4 {letter-spacing: 20px}
</style>
</head>

<body>
<h1>This is header 1</h1>
<h4>This is header 4</h4>
</body>

</html>

参考文献

css文本

相关文章

  • 字间隔Vs字母间隔

    一、字间隔 word-spacing 属性可以改变字(单词)之间的标准间隔。其默认值 normal 与设置值为 0...

  • 技巧

    1、字母替换,用引号和逗号间隔字母

  • 字母的间隔突然变大

    因为变大的原因是 使用了 全角字符 按住 shirft + 空格键 就可以换回来 半角字符了

  • react-intl——react国际化使用方案

    国际化介绍 i18n:internationalization 国家化简称,首字母+首尾字母间隔的字母个数+尾字母...

  • 间隔

    文/Ra丶atom 窗儿之间 隔着一道彩虹 我爬不过去 你也不会走来 我痴望它的七彩 心儿之间 隔着一堵粉墙 我穿...

  • 间隔

    我感谢她与我,隔着一条信息,对视一眼后的缄默不语,她太晓得了,也晓得我经不起诱导。写这些话的时候,发现这支笔是...

  • 《间隔》

    《间隔》 -- 杏子 你我明明同一条路 却差好几条街

  • 间隔

    没有间隔年,间隔周也不错。值得期待。在海里反正你找不到我。 同事太优秀太上进,压力好大。

  • 间隔

    在心里有一条线,从遇见你的那天笔尖就在纸上游走了。其实是有两条线的,只是恋爱中的人习惯性的忽略了重叠的部分,直到到...

  • 间隔

    自从上一次写已经好久了,本来感觉挺方便的,但可能是不太喜欢这种方式,所以还是有时间就动手写一写,同时也练练心,本来...

网友评论

    本文标题:字间隔Vs字母间隔

    本文链接:https://www.haomeiwen.com/subject/umoceftx.html