In this tutorial we will show you how to justify text in HTML, in HTML, there are many tags in html in which when we write text, the text showed on webpage and by default the text gets aligned to left side.
There are many properties of fonts that you can use to make font more effective and today, we here discuss that how we are able to justify text means that how we can align the text so that the all the spaces to left and right side of the line gets covered and the paragraph and division looks more creative.
Step By Step Guide On How To Justify Text In HTML :-
As, the most known alignments of text are left, right and center. The left aligns texts to lefts side, where right aligns the text to right side and at last the center is used to align the text to center.
There is one more property of text that is to align font or text in justify alignment.
As we already discussed about justify alignment, now we show you code in which we use the properties to justify text and later we discuss that what we do in that.
<!DOCTYPE html>
<html>
<head>
<title> Title of the document<title>
</head>
<body>
<p style="text-align: justify;">
Lorem ipsum dolor sit amet consectetur adipisicing elit. Dolorem dolor laborum nesciunt ipsam, velit dolore soluta consequatur inventore laboriosam dignissimos, fugiat quidem reiciendis. Atque reiciendis asperiores ratione soluta ducimus aspernatur, molestias debitis. Similique corrupti laborum libero quam temporibus perferendis ullam voluptatem, nulla, in at repudiandae a? Dolore tempore quae nisi?
</p>
<h1 align="justify">
Lorem ipsum, dolor sit amet consectetur adipisicing elit. Labore vitae ad aut a. Totam ratione expedita odit omnis, amet, dolore iure earum, eaque ab tempore obcaecati libero velit exercitationem maxime quia possimus voluptates quis ut inventore optio? Saepe fugiat quas sint pariatur recusandae voluptatibus nisi.
</h1>
<div style="text-align: justify;">
Lorem ipsum dolor sit amet consectetur adipisicing elit. Incidunt ad unde accusamus tenetur ducimus architecto accusantium laboriosam, molestias fuga dolorem?
</div>
</body>
</html>
- First, we write <! DOCTYPE html> which we used as an instruction to the web browser about what version of HTML file is written in.
- Secondly, the <html> tag is used to indicate the beginning of an HTML document.
- As above now <head> tag is used to contain information about web page. In this tag a <title> tag is used which helps us to specify a webpage title. Both <head> and <title> tags are Paired tags. So, both have </head> and </title> ending tags respectively.
- Thirdly, <body> tag is used to define the webpage body. All the contents to show on website are written here.
- Hence, in body we use three different tags to show you that we can align any text in any position, but we use justify here and to all the tags also.
- We use justify here, by using CSS properties. For this, we first give style attribute to tags and in this text-align is used to provide a value to it. Now, we give justify value to this property to justify text.
- At last, the <body> and <html> tags are closed with </body> and </html> respectively.
Conclusion :-
In conclusion, we can say that we can align any text in any tag to any position. the main thing is to give value to text-align property and the value which you want. I hope this tutorial on how to justify text in HTML helps you.
About Anjali
