HTML DOM lineHeight 属性
JavaScript基础 2022-06-08 14:51:39小码哥的IT人生shichen
HTML DOM lineHeight 属性
定义和用法
lineHeight 属性设置行之间的距离（行高）。
语法：
Object.style.lineHeight=normal|number|length|%
可能的值
| 值 | 描述 |
|---|---|
| normal | 默认。设置合理的行间距。 |
| number | 设置数字，此数字会与当前的字体尺寸相乘来设置行间距。 |
| length | 设置固定的行间距。 |
| % | 基于当前字体尺寸的百分比行间距。 |
实例
本例改变行高：
<html>
<head>
<script type="text/javascript">
function changeLineHeight()
{
document.getElementById("div1").style.lineHeight="2";
}
</script>
</head>
<body>
<div id="div1">
This is some text. This is some text. This is some text.
This is some text. This is some text. This is some text.
This is some text. This is some text. This is some text.
This is some text. This is some text. This is some text.
</div>
<br />
<input type="button" onclick="changeLineHeight()"
value="Change line-height" />
</body>
</html>TIY
完整实例【lineHeight - 改变行高】：
<html>
<head>
<script type="text/javascript">
function changeLineHeight()
{
document.getElementById("div1").style.lineHeight="2";
}
</script>
</head>
<body>
<div id="div1">
This is some text. This is some text. This is some text.
This is some text. This is some text. This is some text.
This is some text. This is some text. This is some text.
This is some text. This is some text. This is some text.
</div>
<br />
<input type="button" onclick="changeLineHeight()" value="Change line-height" />
</body>
</html>
可以使用本站在线JavaScript测试工具测试上述代码运行效果：http://www.phpcodeweb.com/runjs.html
