HTML text size: formatting rules

HTML is a hypertext markup language used to format web documents. It provides the main possibilities of compiling the structure of the document, as well as basic options for page design. This article will explain in detail how to resize text in HTML. We will find out when it is possible to use only HTML, and when it is preferable to resort to CSS style sheets.

html tags




Resize with the <font> tag

There are several different ways that you can resize text in HTML. Such features are represented by the web markup language itself, as well as CSS style sheets that are connected to the document.

The first way to increase or decrease text on a web page is to use the <font> tag. The syntax for using this tag is as follows:

<font size="3" color="green" face="Georgia">  </font>
      
      



Let's look at this example in more detail. As you can see, here are three attributes of the <font> tag, which allow you to specify the typeface, size and color of the HTML text.

The size attribute is responsible for the size - it allows you to set the size of the text in arbitrary units. It is taken as the average value of this parameter 3. Accordingly, it can be set both in absolute units (that is, 1, 7, 4, etc.) and in relative units using the plus or minus signs (+3, -2) . In the second case, the text size will be changed in relation to the base.





html code




The color attribute indicates what color the displayed text will be, and face is responsible for the headset (font). Thus, the text on the example will be the standard default medium size, green, written in the font Georgia.

In modern browsers, this method of changing the size of text in HTML almost always works, but this method is considered somewhat outdated - it is recommended to use the formatting using CSS.

Other ways to reduce and enlarge text in HTML

In order to resize text in HTML, the <big> and <small> tags are also used.

These tags are used as follows:

 <big>   </big> <small>   </small>
      
      



Interestingly, in order to make the text even larger or smaller, the tag can be repeated several times.

 <big><big>     </big></big>
      
      



In addition to these two tags, it is possible to use headers for resizing text in HTML (for example, H1 to specify large text, and H6 to reduce its size). However, this is not recommended, since the title is the structural unit of the web page, and using it for visual formatting can complicate the indexing and accessibility of the site.

laptop programming




Resize text using CSS

In order to change the size of the text, it is recommended to use CSS. The syntax will look like this:

  p { font-size: 11pt; }
      
      



There are many more features available for this method. You can change the text size in various units, such as points (pt), pixels (px), percentages and others.

This method is used either through the <style> tag directly in the body of the HTML document, or through an external stylesheet connected to a separate file with a link in the document.

The developers are unanimous in the opinion that, taking into account optimization and cross-browser compatibility, it is more preferable to use CSS features for styling and design, and for HTML to leave its original function of the hypertext markup language.

So, we introduced several different ways to resize text in HTML documents. Which one to use depends on your needs and the desired functionality of the page.




All Articles