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. Domino 迁移到Exchange 之 Domino Admin 安装!

    双击Setup 安装:

  2. [respberry pi3][suse] 配置docker

    [respberry pi3][suse] 配置docker arm64 suse上总的软件还是比较少的,特别是对32bit的一些支持,比较熟悉ubuntu,但是不能raspberry pi3没有64 ...

  3. python3.5在内存中获取远程图片尺寸

    自已看看,用于获取选程图片的尺寸 >>> from io import BytesIO>>> import requests as rs>>> f ...

  4. Nginx使用

    1. 基本使用 分linux和windows版 windows版可以直接双击exe运行,默认配置为80端口,只有两个页面 html目录下为页面.css.js等代码文件 conf目录下为配置文件 主要的 ...

  5. Conditional Expressions

    Conditional Expressions建立一些逻辑关系 The conditional expression classes from django.db import models clas ...

  6. leetcode 48. 旋转图像 java

    class Solution { public void rotate(int[][] matrix) { int n = matrix.length; for (int k = 0; k < ...

  7. Linux基础实验(一)

    一)基础实验:1. Unix中常见shell及其命令(shell的缩写)    Bourne shell (sh)      Korn shell (ksh)    C shell (csh)     ...

  8. 小记一次shellscript的麻烦

    小记一次shellscript的麻烦 一.起因: 之前写过篇文章 文本分析实例 ,大致的内容就是对 "nginx的web服务器进行日志分析,删除不被访问的截图". 点我打开哔哩哔哩 ...

  9. 多张表进行关联查询---->删除某个数据的时候出现还有子记录的提示

    多张表进行关联查询的时候,当某张表里面的一个字段在另外一张表有定义,就相当于一张表是另外一张表的子表:比如现在开发所遇到的一个问题: 这个是在删除sys_user表的里面的数据的时候出现的问题,因为s ...

  10. Java-代理模式的理解

    引言 设计模式是语言的表达方式,它能让语言轻便而富有内涵.易读却功能强大.代理模式在Java中十分常见,有为扩展某些类的功能而使用静态代理,也有如Spring实现AOP而使用动态代理,更有RPC实现中 ...