One of the simplest things when we want to format the text will be to center the text. This was more or less simple in HTML using the center tag. However, this tag became obsolete with the arrival of style sheets CSS. So let’s see how we can center text with CSS on your web page.
Within the CSS properties that allow us to modify the text a property appears called
text-align
, which will allow us to align the text in the position we need. In the case that we want to have it centered, the value to associate is «center».
What we will have is to define a class with this property. For example, in this case we have defined a class that we have called centered:
.centered{
text-align:center;
}
Now we will only have to apply this class to the text that we have within our web page. To apply a style you must use the attribute class
of an element HTML.
For our example we have used an element
p
, which represents a paragraph and we have applied it in the following way.
<p class="centered">Centered text</p>
The text will appear as follows:
Centered Text
As you have seen, the code is very simple to be able to center text with CSS on your web page and apply it to the parts of your HTML code where you need it, reusing the same class.
In the same way you can investigate the rest of the values that the
text-align
since these allow us to handle the text in many ways and so we can align it to the right, justify it on all lines or justify it on all lines except the last,… Can you tell us in the comments what you have been able to do with the property
text-align
? o What would you like to know when justifying the alignment of the text?