(转)CSS定义字体间距 字体行与行间距

源网址:http://www.cnblogs.com/jian1982/archive/2010/07/03/1770349.html

CSS定义字体行间距 line-height:xxpx;

CSS定义字体间距

下面我们讲述一下CSS的文本属性,还是先来看一下文本属性的详细列表:

属性 属性含义 属性值
Word-spacing 定义了各个单词之间的间距 Normal<length>必须以长度为单位
Letter-spacing 定义了每个字母之间的间距 同上
Text-decoration 定义文字的“装饰”样式
None|underline|overline|

line-through|blink

Vertical-align
定义了元素在垂直方向

上的位置


Baseline|sub|super|top|text-top|middle|bottom|text-bottom

<percentage>

text-transform 使文本转换为其它形式 Capitalize|uppercase|lowercase|none
Text-align 定义了文字的对齐方式 Left|right|center|justify
Text-indent 定义了文本的首行的缩进方式 <length>|<percentage>
Line-height 定义了文本的行高
Normal|<unmber>|<length>|

<percentage>

我们可以从表中看到在这里可以定义文本的文字间距、字母间距、装饰、对齐方式、缩进方式和行高等属性。

举个例子来看看吧:

CODE:

<p style="letter-spacing:5px;text-align:justify;text-indent: 4em;line-height:17pt">我们看到经过文本属性处理的文本字与字之间多了间距,行与行之间多了行高,对齐方式变成了两端对齐,并且段首又多缩进了两格。</p>

letter-spacing设置了字间距为5px,其中5px为一个长度单位;text-align设置了对齐方式为两端对齐;indent设置了缩进格为4em;line-height设置了行高为17pt

从上面的例子,我们可以看出利用CSS的文本属性可以方便的对页面中的文本进行排版。

时间: 2024-10-25 12:00:49

(转)CSS定义字体间距 字体行与行间距的相关文章

CSS定义字体间距 字体行与行间距

CSS定义字体行间距 line-height:xxpx; CSS定义字体间距 下面我们讲述一下CSS的文本属性,还是先来看一下文本属性的详细列表: 属性 属性含义 属性值 Word-spacing 定义了各个单词之间的间距 Normal<length>必须以长度为单位 Letter-spacing    定义了每个字母之间的间距 同上 Text-decoration 定义文字的"装饰"样式 None|underline|overline| line-through|blin

用CSS定义每段首行缩进2个字符 转

应该遵循w3c所制定的html/xhtml标准来使用tag和编写网页.如果你对此不太了解,可以到w3c的网站www.w3.org去找相关资料,或者买一本xhtml的书(注意不要买过时的html的书,尽量选择外国人写的)看.               在你的这个问题里,你首先要了解的是block元素和inline元素的区别,p.div等属于block元素,而a.span.br都是inline的元素.text-indent既然是定义与一个段落相关的信息,即段首缩进,则只作用在block元素上而不是

css网页使用自定义字体方法

@font-face可以加载服务器端的字体到浏览器端,这样设计师就可以不受客户端字体库的限制. 一般来说有四种格式的字体文件即可覆盖所有浏览器.这四种格式为: .EOT:适用于Internet Explorer 4.0+. .TTF或.OTF:适用于Firefox 3.5.Safari.Opera. .SVG:适用于Chrome.IPhone. .WOFF:转为web字体指定的字体格式标准,被新版本浏览器广泛支持. 语法+举例:在css中如下写 @font-face { font-family:

CSS远程加载字体

CSS 远程加载字体的方法,做网站CSS的都知道,用户浏览网站时,网页上的字体是加载本地的.换言之,如果网站使用了用户电脑所没有安装的字体,那显示字体就会被默认字体所代替了,自然效果就大受影响了. 上网搜索了下,这个问题,其实还是有解决办法的.那就是,准备一个或几个字体文件,放置到服务器上,再用 CSS 的方法把字体加载到网页中,这样,即使用户电脑中没有某一种字体,也可以正常显示! 以微软雅黑为例,一般来说,VISTA 系统和现在的 win7 系统都自带了这种字体,但 winXP 却没有.如果网

Css中常用中文字体的Unicode编码对照

在网页制作中,最常用的恐怕是字体属性了,在调整页面兼容的时候,也常常发现字体名称的原因导致不兼容或乱码,下面给出几种常用字体的ucicode编码对照,方便使用. 宋体 SimSun \5B8B\4F53 黑体 SimHei \9ED1\4F53 微软雅黑 Microsoft YaHei \5FAE\8F6F\96C5\9ED1 微软正黑体 Microsoft JhengHei \5FAE\x8F6F\6B63\9ED1\4F53 新宋体 NSimSun \65B0\5B8B\4F53 新细明体

textview-调节字体间距跟行距

直接进行代码验证 1)当没有添加字体间距属性的时候 <TextView android:id="@+id/text_view" android:layout_width="wrap_content" android:layout_height="wrap_content" android:adjustViewBounds="true" android:maxWidth="250dp" android:

优化数据页面(6)——用宽粗的字体突出标题行

优化数据页面(6)--用宽粗的字体突出标题行 设计要点:优化数据页面.界面设计.美化excel 秀秀:不许这么虚伪!想让着俺也不用这么"小儿科"吧? 阿金:真难伺候!夸你也不行,不夸也不行! 秀秀:去去去!"抱怨"才是你的本性! 阿金:可是,你得给俺一个改过自新的机会呀! 秀秀:别废话!俺现在说出一个--标题使用宽粗的字体,比如华文琥珀,而明细数据使用较细的字体,该你啦,你的必须更有"份量"才行! 阿金:俺觉得你的这条就很好! 秀秀:又开始了!你

CSS 让 fontawesome 图标字体变细

一句 CSS 让 fontawesome 图标字体变细 自从 iOS 某个版本发布之后,前端的流行趋势是什么都越来越细-字体越来越细-图标线条也越来越细.而老物 fontawesome 粗壮的线条风格很显然已经跟不上流行的趋势了,不过在现代的浏览器里,倒是有办法让 fontawesome 改头换面,重获青春. 2018-04-12 补充:好久没有访问 fontawesome 的官网,现在居然也出 solid / regular / light(可能就是你们想要的细版)三种版本了!如果你放在访问了

font-family:黑体;导致css定义全部不起作用

css文件里font-family: "黑体";这句会导致后面的css定义全部不起作用了.只要把font-family: "黑体"; 改成font-family:黑体; 就行了,去掉空格和双引号.这个问题只存在于IE6中.在互联网上找到的部份答案一处容器的font-family属性里写了"宋体",而IE6一下不解析""号,于是就导致整个页面的居中失效 css中指定font-family属性为黑体.幼圆.微软雅黑等,一一无法正常