In web development, the choice of fonts and the correct alignment of texts are fundamental aspects to achieve an attractive and readable design. In this article, I'll show you how to use CSS to change the texts, spacing, and alignments of your web page.
Change texts with CSS
When we create a web page, it is common that we want to customize the appearance of the texts. CSS allows us to change the font, size, color and other styles of the texts on our page. To do this, we use the property font-family to define the source, and the property font-size to set the text size.
For example, if we want to use the font "Arial" and a text size of 16 pixels, we can use the following CSS code:
body { font-family: Arial, sans-serif; font-size: 16px; }
This way, all text elements within the element <body> They will use the "Arial" font and a size of 16 pixels.
Align text in HTML and CSS
Text alignment is another important aspect to improve the readability of our website. CSS offers us various properties to align the text in different ways.
For example, if we want to center a text in HTML, we can use the property text-align with the value "center". The following CSS code shows how to do it:
.centered-text { text-align: center; }
When you apply this class to an HTML element, the text within that element will be centered horizontally.
In addition to centering, we can also justify the text using the property text-align with the value "justify". This option distributes the text evenly along the line, creating aligned margins on both sides.
For example:
.justified-text { text-align: justify; }
With this code, the text inside the element with class "justified-text" will be justified along the line.
Frequently asked questions
How can I change the font in HTML?
You can change the font in HTML using CSS. To do this, define the property font-family on the element you want to modify. For example:
h1 { font-family: "Roboto", sans-serif; }
How can I center text in HTML?
To center text in HTML, use the property text-align with the value "center" in the element containing the text. For example:
<div style="text-align: center;">Centered text</div>
How can I justify text in HTML?
To justify text in HTML, use the property text-align with the value "justify" in the element containing the text. For example:
<p style="text-align: justify;">Justified text</p>
What other properties can I use to change text styles in CSS?
In addition to font-family y font-size, you can use properties like color for text color, font-weight for font thickness, text-decoration to add decorations to the text (such as underlining), among others.
In conclusion, fonts and text alignments are essential aspects for the design of a web page. With CSS, we can change the styles of the texts and align them appropriately. Use these techniques to create more attractive and readable web pages.
English 
Spanish