中文字间隔、字母间隔设置:

如果想在网页排版中设置文字间隔或者字母间隔就可以使用    letter-spacing 来实现,如下面代码:

h1{
letter-spacing:50px;
}
...
<h1>了不起的盖茨比</h1>

注意:这个样式使用在英文单词时,是设置字母与字母之间的间距。

单词间距设置

如果我想设置英文单词之间的间距呢?可以使用 word-spacing 来实现。如下代码:

h1{
word-spacing:50px;
}
...
<h1>welcome to here!</h1>

示例:

<!DOCTYPE HTML>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title>字间距</title>
<style type="text/css">
h1{letter-spacing:20px;font-size:20px;}
p{word-spacing:20px;}
#pp{letter-spacing:20px;
</style>
</head>
<body>
<h1>hello world, hello rinpe !</h1>
<hr/>
<p>hello world, hello rinpe !</p>
<hr/>
<p id="pp">我的名字叫xxxxx</p>
</body>
</html>

效果:

段落排版--中文字间距、字母间距(letter-spacing, word-spacing)的更多相关文章

  1. Web前端开发基础 第四课(CSS文字和段落排版)

    文字排版--字体 我们可以使用css样式为网页中的文字设置字体.字号.颜色等样式属性.下面我们来看一个例子,下面代码实现:为网页中的文字设置字体为宋体. body{font-family:" ...

  2. iOS UIButton文字和图片间距随意调整

    代码地址如下:http://www.demodashi.com/demo/11606.html 前记 在开发中,我们经常会遇到这么一种情况,就是一个按钮上面有图片也有文字,但是往往设计并不是我们想要的 ...

  3. word里输入英文字母间距变宽,字体改变,怎么回事?

    word里输入英文字母间距变宽,字体改变,怎么回事? 你有没有遇到下面这种情况,在word里输入英文,变的很奇怪,就像下面图中那样: 是不是很蛋疼?看起来很别扭. 那是因为输入法是全角状态 我们只要把 ...

  4. 字母间距letter-spacing

    效果图: 字母间距CSS: h1 {letter-spacing:2px} h2 {letter-spacing:-3px}

  5. Bootstrap_排版_文字样式

    一.段落 段落是排版中另一个重要元素之一.在Bootstrap中为文本设置了一个全局的文本样式(这里所说的文本是指正文文本): 1.全局文本字号为14px(font-size). 2.行高为1.428 ...

  6. [Swift]LeetCode345. 反转字符串中的元音字母 | Reverse Vowels of a String

    Write a function that takes a string as input and reverse only the vowels of a string. Example 1: In ...

  7. leetCode题解之反转字符串中的元音字母

    1.问题描述 Reverse Vowels of a String Write a function that takes a string as input and reverse only the ...

  8. C#LeetCode刷题之#345-反转字符串中的元音字母​​​​​​​(Reverse Vowels of a String)

    问题 该文章的最新版本已迁移至个人博客[比特飞],单击链接 https://www.byteflying.com/archives/3935 访问. 编写一个函数,以字符串作为输入,反转该字符串中的元 ...

  9. 转载: 黄聪:C#中 Excel列字母与数字的转换

    using System; using System.Collections.Generic; using System.Linq; using System.Text; using System.T ...

随机推荐

  1. AppDomain

    AppDomain http://www.cnblogs.com/xiashengwang/archive/2012/07/17/2594623.html http://www.cnblogs.com ...

  2. poj1849

    不难发现每条边最多走两次,最少走一次也就是我们要在所有走两次的边中选两条从根出发没有公共边的路径使路径上的边少走一次显然我们找的是最长路径

  3. Linux Shell编程(29)——函数

    和"真正的"编程语言一样, Bash也有函数,虽然在某些实现方面稍有些限制. 一个函数是一个子程序,用于实现一串操作的代码块,它是完成特定任务的"黑盒子". 当 ...

  4. 笔记-人老了-github

    其实GITHUB是很不错的,虽然之前的JD泄露那件事情,后果很严重. 但是作为个人使用很不错的. github使用入门: 1:申请一个帐号 2:github使用ssh推送的.(ssh走的是加密) 所以 ...

  5. Linux自定义命令

    linux自定义命令,就是给当前命令取个别名.比如:ls 列出当前的文件,rm + 文件名 就能删除该文件,如何自定义命令,可以使用alias比如:alias gobin='cd /opt/tomca ...

  6. FZYZOJ-1144 恶魔城

    P1144 -- 恶魔城 时间限制:1000MS      内存限制:131072KB 状态:Accepted      标签:    图论-最短路   二分   无 Description 上帝需要 ...

  7. Java---基于TCP协议的相互即时通讯小程序

    这是几年前,新浪的一个面试题~要求是3天之内实现~ 通过TCP 协议,建立一个服务器端. 通过配置服务器端的IP和端口: 客户端之间就可以相互通讯~ 上线了全部在线用户会收到你上线的通知. 下线了全部 ...

  8. 在Ant Build文件中使用正则表达式替换文件内容

    这需要在build文件中使用<replaceregexp>标签, 这个标签的使用大概是这个样子的: <replaceregexp file="${src}/build.pr ...

  9. 【PHP】将EXCEL表中的数据轻松导入Mysql数据表

    在网络上有不较多的方法,在此介绍我已经验证的方法. 方法一.利用EXCEL表本身的功能生成SQL代码 ①.先在“phpmyadmin”中建立数据库与表(数据库:excel,数据表:excel01,字段 ...

  10. 《University Calculus》-chape10-向量和空间几何学-叉积

    叉积概念的引入: 在平面中我们为了度量一条直线的倾斜状态,为引入倾斜角这个概念.而通过在直角坐标系中建立tan α = k,我们实现了将几何关系和代数关系的衔接,这其实也是用计算机解决几何问题的一个核 ...