如何设置单词字体间距 css设置字体间距样式代码
发布时间:2012-12-30 14:14:29 作者:佚名
我要评论
![](/skin/2018/images/text-message.png)
如何设置单词字体间距?在div布局中经常会遇到这样的问题,适当的间距可以友好界面,利用闲暇时间整理了一些,有需求的朋友可以参考下
CSS教程文本属性: 字体间距
用法:
word-spacing: 1cm;
word-spacing: 10pt;
word-spacing: 10px;
word-spacing: none;
定义:
使用这个属性我们可以定义或者设置单词之间的距离
word-spacing属性可以设置以下的值。
a)cm:以厘米为单位设置属性值,例如:1cm等...
b)px:以像素为单位设置属性值,例如:1px或者10px等...
c)pt:以点为单位设置属性值,例如:1pt或者2pt等...
d)norm:以初始值/默认值为单词间距。
示例1:
<font style="word-spacing: 1cm;"> 试验字间距 </font>
结果:
自己测试
示例2:
<div style="word-spacing: 10px;"> 试验字间距 </div>
结果:
自己测试
示例3:
<h5 style="word-spacing: 10pt;"> 试验字间距 </h5>
结果:
自己测试
示例4:
<font style="word-spacing: none;"> 试验字间距 </font>
用法:
复制代码
代码如下:word-spacing: 1cm;
word-spacing: 10pt;
word-spacing: 10px;
word-spacing: none;
定义:
使用这个属性我们可以定义或者设置单词之间的距离
word-spacing属性可以设置以下的值。
a)cm:以厘米为单位设置属性值,例如:1cm等...
b)px:以像素为单位设置属性值,例如:1px或者10px等...
c)pt:以点为单位设置属性值,例如:1pt或者2pt等...
d)norm:以初始值/默认值为单词间距。
示例1:
复制代码
代码如下:<font style="word-spacing: 1cm;"> 试验字间距 </font>
结果:
自己测试
示例2:
复制代码
代码如下:<div style="word-spacing: 10px;"> 试验字间距 </div>
结果:
自己测试
示例3:
复制代码
代码如下:<h5 style="word-spacing: 10pt;"> 试验字间距 </h5>
结果:
自己测试
示例4:
复制代码
代码如下:<font style="word-spacing: none;"> 试验字间距 </font>
相关文章
- 这周了解到一个新的名词,同态,同态可以理解成一种特殊形态吧,这篇文章主要为大家详细介绍了如何使用CSS实现这种同态效果,文中的示例代码讲解详细,感兴趣的小伙伴可以了2024-03-25
- 这篇文章主要为大家详细介绍了如何使用 css3 模拟一个渐变式圆点加载效果,文中的示例代码讲解详细,具有一定的借鉴价值,有需要的小伙伴可以跟随小编一起学习一下2024-03-22
- 想要给一个展示图片的区域底部加一个该图片的放大后的背景,并模糊 20,并增加一个黑色 0.6 透明度的遮罩,这篇文章主要介绍了CSS如何设置背景模糊周边有白色光晕(解决方案2024-03-20
- CSS中内容居中的方法有很多种,具体取决于您想要居中的内容是什么类型的元素以及是在什么情况下居中,这篇文章主要为大家整理了常用的7种方法,感兴趣的小伙伴可以跟随小编2024-03-19
- style属性可以用在HTML中大部分的标签上,本文主要介绍了CSS设置style属性的3种方法,文中通过示例代码介绍的非常详细,需要的朋友们下面随着小编来一起学习学习吧2024-03-15
- 在CSS中隐藏元素有多种方法,这篇文章主要为大家整理了五种常见方法及其适用场景与区别,文中的示例代码讲解详细,具有一定的借鉴价值,有需要的小伙伴可以跟随小编一起学2024-03-15
- 三栏布局是常见的一种页面布局方式,将页面分为左栏、中栏和右栏,这篇文中主要为大家详细介绍了CSS实现三栏布局的四种方法,文中的示例代码讲解详细,感兴趣的小伙伴可以2024-03-11
- 这篇文章主要为大家详细介绍了如何使用CSS实现简单的翻页效果,文中的示例代码讲解详细,具有一定的借鉴价值,有需要的小伙伴可以跟随小编一起学习一下2024-03-06
- 在网页设计中,视差滚动效果可以为用户带来沉浸式的浏览体验,这篇文章主要为大家详细介绍了如何使用CSS完成视差滚动效果,文中的示例代码讲解详细,感兴趣的小伙伴可以跟随2024-02-28
- 粘性定位的元素是依赖于用户的滚动,在position:relative与position:fixed定位之间切换,这篇文章给大家介绍css中position:sticky 粘性定位的相关知识,感兴趣的朋友跟随小2024-02-28
最新评论