html paragraph line spacing line height

In this tutorial we learn how o use <p> p tag for creating paragraph in html page. Customize paragraph appearance using css style property.

Conceptually <p> works just like how we consider paragraph, it takes the width of container, but we can do lot more with paragraph style tag in html page designing.

p 
{
    line-height:30px;
    letter-spacing: 3px;
}

Let's learn using example, We can apply css property to make paragraph appearance beautiful, specifying paragraph hyperlink, line height, letter spacing etc.

<p>
    This is an example of paragraph in html.
</p>

Now if you notice where line break happens in paragraph, take full with of container, so if you need a line break in particular position use <br> tag

Set paragraph font size and line height

Paragraph has a default font size, color and line height, but you can change all defaults value in your web application just by setting standard properties value in your css style sheet file.

You can write something like this in your application CSS file, Note: this is not a class, default property of all paragraph in your application, this is how we can set css property on any html element, default style for paragraph p element.

p 
{
    line-height:30px;
    font-size:18px;
    color:#044472;
}

Alternatively you also can write a class and call them in any p tag you want like this
<p class="className"> here is para content</p>

Here is how we can apply css style in html paragraph hyperlink or anchor tag.

p a, a:hover, a:visited
{
    text-decoration:none;
    font-size:18px;
    color:#044472;
}

Now let's see some example where you can use p tag in web page designing, so following post may help you to understand better.