letter-spacing 属性

支持:所有浏览器都支持 letter-spacing 属性。

letter-spacing 属性增加或减少字符间的空白(字符间距)。

该属性定义了在文本字符框之间插入多少空间。由于字符字形通常比其字符框要窄,指定长度值时,会调整字母之间通常的间隔。因此,normal 就相当于值为 0。

注释:允许使用负值,这会让字母之间挤得更紧。

例子:

<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>

结果:

 

word-spacing 属性

word-spacing 属性增加或减少单词间的空白(即字间隔)。

该属性定义元素中字之间插入多少空白符。针对这个属性,“字” 定义为由空白符包围的一个字符串。如果指定为长度值,会调整字之间的通常间隔;所以,normal 就等同于设置为 0。允许指定负长度值,这会让字之间挤得更紧。

注释:允许使用负值。

<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>

css3中比较少用到的属性记录的更多相关文章

  1. css3中的提供的元素变化属性

    通过 CSS3 提供的2d元素转换,我们能够对元素进行移动.缩放.转动.拉长或拉伸. css3中为我们 提供了: translate() rotate() scale() skew() matrix( ...

  2. CSS3 中弹性盒模型--容器的属性

    1.display : flex | inline-flex注意,设为 Flex 布局以后,子元素的float.clear和vertical-align属性 将失效. 2.flex-direction ...

  3. css3中的变形(transform)、过渡(transtion)、动画(animation)

    Transform字面上就是变形,改变的意思.在CSS3中transform主要包括以下几种:旋转rotate.扭曲skew.缩放scale和移动translate以及矩阵变形matrix.下面我们一 ...

  4. html5--6-23 CSS3中的文字与字体

    html5--6-23 CSS3中的文字与字体 text-overflow 设置是否使用一个省略标记(...)标示对象内文本的溢出 clip: 默认值当对象内文本溢出时不显示省略标记(...),而是将 ...

  5. html5--6-19 CSS3中的文字与字体

    html5--6-19 CSS3中的文字与字体 学习要点 掌握文字与字体的设置 颜色值查询方法: 百度查询,很多网站有提供 下载相关手册等需要时查表 运用绘图工具中的拾色器 CSS中常用的字体属性设置 ...

  6. CSS3中的弹性流体盒模型技术详解

    先回顾一下CSS1 和 CSS2中都已经定义了哪些布局方面的属性,这样也会增加我们理解弹性布局.   其实我们现在有很多一部分人,你们刚刚接触CSS层叠样式表,或者接触有一段时间了,但是却没有很好的去 ...

  7. 第98天:CSS3中transform变换详解

    transform变换详解 本文主要介绍变形transform. Transform字面上就是变形,改变的意思.在CSS3中transform主要包括以下几种:旋转rotate.扭曲skew.缩放sc ...

  8. 第8章 CSS3中的变形与动画(上)

    变形--旋转 rotate() 旋转rotate()函数通过指定的角度参数使元素相对原点进行旋转.它主要在二维空间内进行操作,设置一个角度值,用来指定旋转的幅度.如果这个值为正值,元素相对原点中心顺时 ...

  9. CSS3中的Flexbox弹性布局(一)

    CSS3引入了一种新的布局模式——Flexbox布局,即伸缩布局盒模型(Flexible Box),用来提供一个更加有效的方式制定.调整和分布一个容器里项目布局,即使它们的大小是未知或者动态的,这里简 ...

随机推荐

  1. Gulp资料大全:入门、插件、脚手架、包清单

    awesome-gulp中文版 一份gulp的资源,插件和使用实例清单, 致力于打造更好的前端工程构建流程. 被老外的awesome 清单刺激到,觉得有必要翻译一份,为国产的程序员们做点事情,本清单将 ...

  2. Android 常用第三方框架总结

    一.导航拦 1. FlycoTabLayout https://github.com/H07000223/FlycoTabLayout    2.CoordinatorTabLayout    htt ...

  3. sudo -s/sodo -i/su root

    sudo : 暂时切换到超级用户模式以执行超级用户权限,提示输入密码时该密码为当前用户的密码,而不是超级账户的密码.不过有时间限制,Ubuntu默认为一次时长15分钟.su : 切换到某某用户模式,提 ...

  4. [LeetCode 题解]: Valid Palindrome

    Given a string, determine if it is a palindrome, considering only alphanumeric characters and ignori ...

  5. pipeline+sonar

    前提需要在项目根目录下新建sonar-project.properties文件,内容如下: # must be unique in a given SonarQube instance sonar.p ...

  6. CLR via C# 读书笔记-21.托管堆和垃圾回收

    前言 近段时间工作需要用到了这块知识,遂加急补了一下基础,CLR中这一章节反复看了好多遍,得知一二,便记录下来,给自己做一个学习记录,也希望不对地方能够得到补充指点. 1,.托管代码和非托管代码的区别 ...

  7. 21天学通C++学习笔记(七):函数

    1. 为什么需要函数 可将应用程序的内容划分成依次调用的逻辑块,让您能够划分和组织程序的执行逻辑,有助于提高可重用性. 2. 基本概念 是子程序,可接受参数,可有返回值. 要让函数执行其任务,必须调用 ...

  8. system idle process

    偶然发现windows环境任务管理其中存在进程 system idle process,cpu占用极大但内存占用很小.google了一下,保存下结果 system idle process :系统空闲 ...

  9. Android应用开发以及设计思想深度剖析

    Android应用开发以及设计思想深度剖析(1) 21cnbao.blog.51cto.com/109393/956049

  10. 《Beginning Java 7》 - 7 - abstract class 抽象类 和 interface 接口

    1. 抽象类: 为什么用抽象类: 一些 generic 的类本身并没有现实意义,所以不需要被实例化.比如动物,自然界没有动物这个物种,但却有无数的继承自动物的物种,那么动物本身可以是一个抽象类. 抽象 ...