Special characters line feed. Using whitespace to format HTML code, non-breaking space, and other special characters (mnemonics)

Hello, dear readers of the blog site! Those who have at least superficially managed to get acquainted with, probably already took note, albeit in general terms. This means that they have an idea of \u200b\u200bwhat kind of HTML symbols are used in the document code.

In today's article we will try to figure out what a space is in HTML, in which cases it is possible to use whitespace characters when formatting the code itself for easy reading. We will find out when it is necessary to use a non-breaking space, and also get acquainted with other special characters (or, as they are also called, mnemonics).

In fact, I would advise you not to ignore the topic of using various special characters, since this is an important component that allows you to complete the study of the hypertext markup language. In general, the information provided in this publication will definitely not be superfluous. Well, now to the point.

Spaces and whitespace characters in HTML

An important point needs to be made first. The computer keyboard has special keysthat allow you to implement text splitting (more on this below). However, only a wide spacebar provides a section between words not only in the editor, but also in the browser window. There are nuances with line breaks and margins.

As you know, the display of certain elements in a web browser is determined by tags. For text formatting, a well-known one is used, which is block. That is, its content spans across the entire available width.

To wrap lines within paragraph P, you need to use a single BR tag with which you can do this. Let's say we need to insert into the text some lines from a poem that we write in text editor:

Despite the fact that the lines of the verse are located correctly and the hyphenation is carried out in the right places, everything will look different in the browser:

To achieve the same display in a web browser window, you need to write BR at each line break:

Now we have reached the completion of the task, and in the browser the verse lines will be displayed absolutely correctly:

Thus, the required line breaks are completed. Here it is also necessary to note such a feature that multiple spaces, following one after another, are displayed by the web browser as one. You can be convinced of this if in the same editor you try to put not one, but several spaces between two words and, by clicking on the "Save" button, look at the result in the browser.

Space, tab and line break

Basically, with these whitespace characters we get acquainted immediately, as we start working with the text in the editor and format it in the desired form... To implement such a task, there are special keys, each of which corresponds to its own space character:

• Space is the widest key on a computer keyboard (no label);
• Tabulation - a key on the left with the inscription "Tab" and two arrows pointing in different directions;
• Line break - "Enter" key.

However, as I said above, the final desired result not only in a text editor, but also in a browser, we get only when we use the first key. All three keys (including tabulation and line break are useful when formatting HTML code. For example, this is how a piece of code looks in NotePad ++ (there is a good deal of information about this editor) when displaying all whitespace characters:

We get code that is easy to read and understand thanks to the spaces. The orange arrows mark the indentation created with the Tab key, and the CR and LF characters mark line breaks with the Enter kavisha.

Containers nested within one another are viewed, opening and closing tags are well distinguished. In this form given code you can safely edit. Now compare it with the same code, which does not have such text splitting:

In the same way, using whitespace characters, you can write CSS rules that will visually look understandable and digestible:

After you bring all the styles to a common denominator and completely finish editing the style file, you can expose by removing all spaces from the code. This is necessary for promotion, which is very important when promoting a resource.

Special characters (or mnemonics) in HTML code

Now we will analyze in what cases it is necessary to use special characters, which I mentioned at the beginning of the article. HTML special characters, sometimes called mnemonics, were introduced to solve a long-standing problem with encodings in hypertext markup language.

When you type on the keyboard, the characters of the language you are using are encoded. In the web browser, the typed text will be displayed in the fonts of your choice as a result of the reverse decoding operation.

The fact is that there are many such encodings, now we have no goal to parse them in detail. It's just that each of them may lack certain symbols, which, however, need to be displayed. For example, you have an urge to write single quotes or an accent mark, and these icons are trite to be absent from the set.

In order to eliminate this problem, a system of special characters was introduced, which includes a huge number of various mnemonics. They all begin with an ampersand "&" and usually end with a semicolon ";". At first, each special character had its own digital code. For example, for a non-breaking space, which we will consider in more detail below, the following record will be valid:

But after a while, the most common symbols were assigned alphabetic counterparts (mnemonics) to make them easier to remember. Let's say for the same non-breaking space, it looks like this:

As a result, the browser displays the corresponding symbol. The list of mnemonics is very voluminous, the most commonly used HTML special characters you can find from the following table below:

Use cases for some special characters, including non-breaking space and soft hyphenation

If you have already studied the table a little, then you received confirmation of the words I said above that a digital code () or its alphabetic analogue (symbolic mnemonics) is used to display all special characters, where letters () are written instead of a combination of a lattice and numbers.

Now let's see when you need to apply these codes. Let's say in an article you need to specify some HTML tag for informational purposes, for example,