Everyone who often browses the web must have seen that HTML has some reserved characters that the browser cannot display correctly when parsing. At this time, we need to use character entities to replace them. At the same time, we can also use character entities to replace some symbols that are not found on the keyboard.
1. HTML character entities
Reserved characters in HTML must be replaced with character entities. Some characters not found on the keyboard can also be replaced using character entities.
The browser also interprets the following characters as whitespace: space ( ), tab stop (	), line feed (
), carriage return (
), and ( 　) and so on. So if you want to display blank space, you need to use html entities instead.
2. HTML entities
In HTML, certain characters are reserved.
You cannot use the less than sign (<) and the greater than sign (>) in HTML because the browser will mistake them for tags.
If we want to display reserved characters correctly, we must use character entities in the HTML source code. Character entities look like this:
&entity_name;or&#entity_number;
To display the less than sign, we must write: < or < or < ;
The advantage of using entity names instead of numbers is that the names are easier to remember. The downside is that browsers may not support all entity names (but support for entity numbers is good).
1. Space character
HTML provides five types of space entities (space entities), which have different widths. Non-breaking spaces ( ) are the width of regular spaces and can run in all major browsers. Several other spaces (       ‌ ‍ ) have varying widths in different browsers.
It is called No-Break Space, and its full name is No-Break Space. It is the most common space and the space we use the most. Most people may only be exposed to it. It is the space generated by pressing the space key. In HTML, if you use the space bar to generate this space, the spaces will not accumulate (only count as 1). It can only be accumulated using html entity representation. The width occupied by this space is obviously and strongly affected by the font.
 
It's called "half-width space", and its full name is En Space. En is the unit of measurement for typography, which is half the width of em. By definition, it is equivalent to half the font size (e.g. 8px in a 16px font). Nominally the width of the lowercase letter n. This space inherits the consistent characteristics of the space family: it is transparent. This space has a very stable characteristic, that is, the width it occupies is exactly 1/2 the Chinese width, and it is basically not affected by the font.
 
It's called "full-width space", and its full name is Em Space. Em is a unit of measurement in typography, which is equivalent to the currently specified number of points. For example, 1 em in a 16px font is 16px. This space also inherits the consistent characteristics of the space family: it is transparent. This space also has a very stable characteristic, that is, the width it occupies is exactly 1 Chinese width, and it is basically not affected by the font.
 
It's called narrow space, and its full name is Thin Space. We might as well call it a "skinny space", which means that the space is relatively thin, has a thin body, and occupies a relatively small width. It is one-sixth of an em wide.
‌
It is called Zero Width Non Joiner, the full name is Zero Width Non Joiner, or "ZWNJ" for short. It is a non-printing character that is placed between two characters of electronic text to suppress the ligatures that would otherwise occur. Instead, it uses these two characters. The characters are drawn using their original glyphs. The zero-width non-joiner character in Unicode is mapped to "" (zero width non-joiner, U+200C), and the HTML character value is quoted as: ‌
‍
It is called a zero-width ligature. Its full name is Zero Width Joiner, or "ZWJ" for short. It is a non-printing character that is placed between two characters in certain languages that require complex typesetting (such as Arabic and Hindi), making this Two characters that would not otherwise be hyphenated create a hyphenated effect. The Unicode code point for the zero-width hyphen is U+200D (HTML:‍ ‍).
2. Non-breaking Space
A common character entity in HTML is the nonbreaking space ( ) .
Browsers always truncate spaces in HTML pages. If you write 10 spaces in the text, the browser will delete 9 of them before displaying the page. To increase the number of spaces on the page, you need to use the character entity.
3. Representation of tab key in html
HTML special characters do not include TAB (TAB should be represented by 	. But it only works inside tags like <PRE>...</PRE>, and is only equivalent to a space elsewhere).
If you want to simulate the representation, you can use  this.
The difference between 6 types of white spaces such as       in HTML
HTML provides five types of space entities (space entities), which have different widths. Non-breaking spaces ( ) are the width of regular spaces and can run in all major browsers. Several other spaces (      ‌‍) have different widths in different browsers.
It is called No-Break Space, and its full name is No-Break Space. It is the most common space and the space we use the most. Most people may only be exposed to , which is the space generated by pressing the space key. In HTML, if you use the space bar to generate this space, the spaces will not accumulate (only count as 1). Accumulation can only be achieved by using HTML entity representation. The width of the space is significantly and strongly affected by the font.
 
It's called "half-width space", and its full name is En Space. En is the unit of measurement for typography, which is half the width of em. By definition, it is equivalent to half the font size (e.g. 8px in a 16px font). Nominally the width of the lowercase letter n. This space inherits the consistent characteristics of the space family: it is transparent. This space has a very stable characteristic, that is, the width it occupies is exactly 1/2 the Chinese width, and it is basically not affected by the font.
 
It's called "full-width space", and its full name is Em Space. Em is a unit of measurement in typography, which is equivalent to the currently specified number of points. For example, 1 em in a 16px font is 16px. This space also inherits the consistent characteristics of the space family: it is transparent. This space also has a very stable characteristic, that is, the width it occupies is exactly 1 Chinese width, and it is basically not affected by the font.
 
It's called narrow space, and its full name is Thin Space. We might as well call it a "skinny space", which means that the space is relatively thin, has a thin body, and occupies a relatively small width. It is one-sixth of an em wide.
‌
It is called Zero Width Non Joiner, the full name is Zero Width Non Joiner, or "ZWNJ" for short. It is a non-printing character that is placed between two characters of electronic text to suppress the ligatures that would otherwise occur. Instead, it uses these two characters. The characters are drawn using their original glyphs. The zero-width non-joiner character in Unicode is mapped to "" (zero width non-joiner, U+200C), and the HTML character value is quoted as: ‌
‍
It is called a zero-width ligature. Its full name is Zero Width Joiner, or "ZWJ" for short. It is a non-printing character that is placed between two characters in certain languages that require complex typesetting (such as Arabic and Hindi), making this Two characters that would not otherwise be hyphenated create a hyphenated effect. The Unicode code point for the zero-width hyphen is U+200D (HTML: ‍ ‍).
In addition, the browser will interpret the following characters as whitespace: space ( ), tab stop (	), line feed (
), and carriage return (
). There are (　) and so on.
4. Combine phonetic symbols
A phonetic symbol is a glyph added to a letter.
Diacritical marks can appear above and below letters, within letters, or between two letters.
Diacritical marks can be used in combination with alphabetic and numeric characters.
Useful character entities in HTML
Note: Entity names are case sensitive!