The code below shows you how to specify the line-height of a paragraph using a percent value with CSS.
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
<head>
<title>Web Development Tutorials.com</title>
<style type="text/css">
p.one
{
line-height: 90%;
}
p.two
{
line-height: 200%;
}
</style>
</head>
<body>
<p>
This is a paragraph. This is a paragraph. This is a paragraph. This is a paragraph. This is a paragraph.
This is a paragraph. This is a paragraph. This is a paragraph. This is a paragraph. This is a paragraph.
</p>
<p>
This is paragraph one. This is paragraph one. This is paragraph one. This is paragraph one. This is paragraph one.
This is paragraph one. This is paragraph one. This is paragraph one. This is paragraph one. This is paragraph one.
</p>
<p>
This is paragraph two. This is paragraph two. This is paragraph two. This is paragraph two. This is paragraph two.
This is paragraph two. This is paragraph two. This is paragraph two. This is paragraph two. This is paragraph two.
</p>
</body>
</html>
The code above creates the images below.
This is a paragraph. This is a paragraph. This is a paragraph. This is a paragraph. This is a paragraph. This is a paragraph. This is a paragraph. This is a paragraph. This is a paragraph. This is a paragraph.
This is paragraph one. This is paragraph one. This is paragraph one. This is paragraph one. This is paragraph one. This is paragraph one. This is paragraph one. This is paragraph one. This is paragraph one. This is paragraph one.
This is paragraph two. This is paragraph two. This is paragraph two. This is paragraph two. This is paragraph two. This is paragraph two. This is paragraph two. This is paragraph two. This is paragraph two. This is paragraph two.
Use the text editor below to practice what you have learned.
