CSS参考手册
»
属性列表
»
文本属性
»
相关内容：
其它文本属性参考
选择其它项
text-indent
text-overflow
text-align
text-transform
text-decoration
text-shadow
text-fill-color
text-stroke
text-stroke-width
text-stroke-color
letter-spacing
word-spacing
vertical-align
word-wrap
white-space
direction
unicode-bidi
line-height
tab-size
line-height
版本：CSS1
继承性：有
语法：
line-height
：normal |
<length>
|
<percentage>
|
<number>
默认值
：
normal
取值：
normal：
允许内容顶开或溢出指定的容器边界。
<length>
：
用长度值指定行高。可以为负值。
<percentage>
：
用百分比指定行高，其百分比取值是基于字体的高度尺寸。可以为负值。
<number>
：
用乘积因子指定行高。可以为负值。
说明：
检索或设置对象的行高。即字体最底端与字体内部顶端之间的距离。
对应的脚本特性为
lineHeight
。
兼容性：
浅绿
= 支持
红色
= 不支持
墨绿
= 部分支持
橙色
= 实验性质
支持版本
\类型
IE
Firefox
Safari
Chrome
Opera
版本
6.0
4.0
5.1
13.0
11.50
示例：
<!DOCTYPE html> <html lang="zh-cn"> <head> <meta charset="utf-8" /> <title>CSS line-height_CSS参考手册_web前端开发参考手册系列</title> <meta name="author" content="phpstudy.net" /> <meta name="copyright" content="www.phpstudy.net" /> <style> .test div{width:300px;margin:15px 0;border:1px solid #000;} .test p{margin:0;font-size:30px;} .fixed div{line-height:20px;} .percentage div{line-height:130%;} .gene div{line-height:1.5;} </style> </head> <body> <ul class="test"> <li class="fixed"> <strong>固定数值方式：</strong> - {line-height:20px;} <div><p>使用固定数值的方式定义line-height，如设置行高为18px类似这样的固定数值，可能会引发文字重叠的现象。</p></div> </li> <li class="percentage"> <strong>百分比方式：</strong> - {line-height:130%;} <div> 如果是这种情况 <p>使用百分比的方式定义line-height，与使用固定数值方式一样，也可能会引发文字重叠的现象。</p> </div> </li> <li class="gene"> <strong>因子方式：</strong> - {line-height:1.5;} <div> 如果是这种情况 <p>使用因子方式定义line-height是非常安全的方式，将可以避免文字重叠的现象。</p> </div> </li> </ul> </body> </html>