<html>
<head>
<title>PrettyPretty</title>
<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>