Change line Height in JavaScript

Description

The following code shows how to change line Height.

Example


<!--   w  ww.j a v a 2 s .  c o  m-->
<html>
<head>
<script type="text/javascript">
function bigger() {
var div = document.getElementById("div1");
div.style.fontSize="larger";
div.style.letterSpacing="10px";
div.style.textAlign="justify";
div.style.textTransform="uppercase";
div.style.fontSize="xx-large";
div.style.fontWeight="900";
div.style.lineHeight="40px";
}

function smaller() {
var div = document.getElementById("div1");
div.style.fontSize="smaller";
div.style.letterSpacing="normal";
div.style.textAlign="left";
div.style.textTransform="none";
div.style.fontSize="medium";
div.style.fontWeight="normal";
div.style.lineHeight="normal";
}
</script>

</head>
<body>
<a href="javascript:bigger();">bigger</a>
<a href="javascript:smaller();">smaller</a>
<div id="div1">
<p>p1</p>
<p>p2</p>
</div>
</body>
</html>

Click to view the demo

The code above generates the following result.

Change line Height in JavaScript
Home »
  Javascript Tutorial »
    Style »
      Text
Javascript Tutorial Text
Change element textDecoration: line-through...
Change element textDecoration: underline, n...
Change line Height in JavaScript
Change text decoration in JavaScript