letter-spacing与word-spacing的区别_html/css_WEB-ITnose
程序员文章站
2022-04-15 20:41:56
...
letter-spacing与word-spacing的区别:
l标题中的两个属性的使用频率虽然算不上多,但是也不能说没有用武之地,它们两个由于在外观和作用上都有相似之处,但是也有很大的不同,下面就通过实例简单介绍一下。
实例一:
l标题中的两个属性的使用频率虽然算不上多,但是也不能说没有用武之地,它们两个由于在外观和作用上都有相似之处,但是也有很大的不同,下面就通过实例简单介绍一下。
实例一:
蚂蚁部落 I am a good boyI am a good boy
由以上的代码表现可以看出,letter-spacing修改的是字母或者字符之间的间距,而word-spacing修改的是字(单词)之间的间距。以上代码中letter-spacing将字母之间的间距设置为40px,需要注意的是,空格也算是一个字符,例如"I"与"am"之间的空格与两边的字母的间距也会设置为40px,所以"I"和"a"之间的间距是80px。word-spacing会将单词之间的间距设置为40px。
特别说明:
letter-spacing与word-spacing准确的说不是设置字母和字之间的间距,而是在指定的字母和字之后添加指定的间距,最后一个字母和字除外。
实例二:
蚂蚁部落 蚂蚁部落蚂蚁部落蚂 蚁部落
有以上代码的表现可以看出,对于汉字,如果连在一起则被视作一个“word”。
原文地址是:http://www.51texiao.cn/div_cssjiaocheng/2015/0501/517.html
最为原始地址是:http://www.softwhy.com/
推荐阅读
-
Web时代变迁及html5与html4的区别
-
jquery中html、val与text三者属性取值的联系与区别介绍
-
HTML5标签与HTML4标签的区别示例介绍
-
php 去除html标记--strip_tags与htmlspecialchars的区别详解
-
HTML的行内元素与块级元素的区别?
-
jquery append()方法教程与html()方法教程的区别及使用介绍
-
html中'disabled'与'readonly'的区别
-
网页语言xhtml和html的概念与区别的详细介绍
-
Web时代变迁及html5与html4的区别
-
清空元素html("") innerHTML="" 与 empty()的区别和应用(推荐)