css怎么让字之间的间隔变大
时间:2021-09-13
来源:互联网
今天PHP爱好者给大家带来css怎么让字之间的间隔变大方法教程,在css中,可以利用letter-spacing属性来让字之间的间隔变大,只需要给包含文字的容器元素添加“letter-spacing:间距值;”样式即可。希望对大家有所帮助。
本教程操作环境:windows7系统、CSS3&&HTML5版、Dell G3电脑。
css让字之间的间隔变大
在css中,可以利用letter-spacing属性来让字之间的间隔变大。对于这个属性来说:每一个中文文字作为一个“字”,而每一个英文字母也作为一个“字”!
示例:letter-spacing属性让字之间的间隔变大
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>css letter-spacing属性设置字间隔</title>
<style>
.demo {
height: 100px;
margin: 10px 0;
border: 1px solid red;
}
.spacing {
letter-spacing: 20px;
}
</style>
</head>
<body>
<p class="demo">
<p>hello,你好呀!</p>
<p>ab cd 你好00)!</p>
</p>
<p class="demo">
<p class="spacing">hello,你好呀</p>
<p class="spacing">ab cd 你好00)!</p>
</p>
</body>
</html>
效果图:
说明:
letter-spacing 属性增加或减少字符间的空白(字符间距),该属性定义了在文本字符框之间插入多少空间。由于字符字形通常比其字符框要窄,指定长度值时,会调整字母之间通常的间隔。
可以设置的属性值:
normal | 默认。规定字符间没有额外的空间。 |
length | 定义字符间的固定空间(允许使用负值)。 |
以上就是css怎么让字之间的间隔变大的详细内容,更多请关注php爱好者其它相关文章!
-
奥迪APP怎么显示车辆未完全锁定-奥迪APP显示车辆未完全锁定方法介绍 时间:2025-05-13
-
《携程旅行》乘客信息删除方法 时间:2025-05-13
-
哔哩哔哩舰长等级怎么提升-哔哩哔哩舰长等级提升步骤介绍 时间:2025-05-13
-
notion中文版设置教程 时间:2025-05-13
-
哔哩哔哩舰长怎么退还-哔哩哔哩舰长退还方法介绍 时间:2025-05-13
-
币安怎么参与合约跟单?-复制交易功能与高手选择技巧 时间:2025-05-13
今日更新
-
javascript replace怎么用
阅读:18
-
es6继承和es5继承的区别是什么
阅读:18
-
javascript怎么求余数
阅读:18
-
es6数组去重的方法是什么
阅读:18
-
javascript 有map吗
阅读:18
-
深入了解Angularjs中的视图和指令
阅读:18
-
解决TP获取微信用户信息出现10003错误问题
阅读:18
-
css怎么改行元素为块元素
阅读:18
-
uniapp项目中怎么引入并使用uViewUI
阅读:18
-
es6新增加的数据类型有是什么
阅读:18