How to align the text in html
Learn how to align text in HTML with a simple example and code snippet.
Text Alignment in HTML
HTML provides several ways to align text, including the text-align
property, which is used to align block-level elements. This property specifies the horizontal alignment of text within a block-level element, such as a paragraph, header, or table cell. It is used in conjunction with other properties, such as margin and padding, to control the overall layout of an element.
The text-align
property can take on several values, including left
, right
, center
, and justify
. For example, the following code will align a paragraph of text to the left:
<p style="text-align: left;">This text will be aligned to the left.</p>
The default value of the text-align
property is left
. If you do not specify a value, the text will be aligned to the left by default.
You can also use the text-align
property to align text within a table. For example, the following code will align the text in the first column of a table to the right:
<table>
<tr>
<th style="text-align: right;">Name</th>
<th>Age</th>
</tr>
<tr>
<td style="text-align: right;">John Doe</td>
<td>25</td>
</tr>
</table>
Finally, the text-align
property can also be used to align the text of a header element. For example, the following code will align the text of a <h2>
element to the center:
<h2 style="text-align: center;">This is an H2 Header</h2>
In summary, the text-align
property is used to align the text within a block-level element, such as a paragraph, header, or table cell. It can take on several values, including left
, right
, center
, and justify
. The default value is left
. You can also use the text-align
property to align the text of a header element.