HTML highlighting: Highlight text with bold, italics and color

Greetings to you, those who like to disassemble something new and replenish their chest of knowledge with new information! After reading the article, you will learn how to make bold text in html, what other types of styles exist and what elements are responsible for this. As a result, your site will be able to boast of readable text with correctly highlighted key points.

In previous articles, I talked a lot about attributes and tags of web languages, about methods of designing appearance and , but I never touched on a certain object without which not a single site can live. This is text.

And not just a continuous set of letters, but intelligently divided into paragraphs, highlighting key words, quotes, links, etc. For this purpose, CSS languages provide special style tools. Let's get started!

Style options in html

The font of text content can always be modified. For example, you can set it to bold or italic, and you can also decorate it. For this, there are simple tags that are very easy to remember and then apply. Below is a table of elements that explains their purpose.

First, let's look at bold text elements.

To increase the thickness of letters, there are paired tags such as and . The use of these tools appears the same because they format the text in bold. However, their purpose is different. Therefore, they cannot be called equivalent and only one of them cannot be used.

Thus, the tag was created with the condition of changing the standard font into a rich and thickened one. It refers to the physical appearance of the outline and does not carry any semantic load. So let's say this is just a type of test display.

A is intended to focus attention on the key point. This is a logical element that would stand out through intonation during a conversation.

Now let's look at tags like And .

They format the standard font into italic. I think you will ask a logically arising question: “Are these elements also different from each other based on the principle of tags and ?” The question is correct. And you're right!

Indeed, a markup language unit is designed to emphasize important points and details, while just a variation of the appearance of the content.
Tools for modifying fonts in css
CSS is not far behind and offers developers similar tools for text editing. These are properties such as text-decoration and font.

– this is a universal parameter that complements the font with certain details. Thus, the text can be “forced” to blink (blink), underline (underline) or strike out (line-through), draw a line over the words (overline), inherit the characteristics of the parent object (inherit) or clear the font format of all additions (none).

The second commonly used mechanism for editing text content is the font property. With its help, you can change the font style (font-style), its size (font-size), set capitals, i.e. indicate the type of lowercase letters (font-variant), as well as “play” with the style (font-weight).
And here is an example
Taking into account all the information that I shared above, we will try to create an example code in which we make the most of the acquired knowledge (I remind you that the code can be typed in ).