Go The wording of CSS Hollow lattice

http://www.zhangxinxu.com/wordpress/?p=4562

characters and HTML entities	Description and Description
 	This is the space that we use the most, that is, the space key to create spaces. In HTML, if you use the SPACEBAR to generate this space, the space will not accumulate (only 1). To use an HTML entity representation to accumulate. For the sake of memory, I always make this space "Sp–space" (NB), although it is not really cool. This space occupies a width that is strongly influenced by the font. There are minor damage in the Inline-block layout, which is an essential element in the two-pronged layout. It's a little thing that people love and hate.
 	The blank is of unknown scientific name. For the sake of memory, we might as well call it "evil (e N-ian) space". This space inherits the character of the space family: transparent drip! This space has a fairly robust feature, that is, it occupies a width of exactly 1/2 Chinese width , and is largely unaffected by the font.
 	The blank is of unknown scientific name. For ease of memory, we might as well call it "demon (e M-o) space". This space also inherits the character of the space family: transparent drip! This space also has a fairly robust feature, that is, it occupies a width of exactly 1 Chinese width , and basically unaffected by the font.
 	The blank is of unknown scientific name. We may call it "thin space", that is, the space is relatively thin, thin body, occupy a relatively small width. I'm not used to this thing at the moment, and it's going to be a bit of a mass actor's addiction.

One of the   and  , because of a certain super-like features, so that they can board the Web stage! What characteristics? The above table is shown in bold, 1. transparent; 2. The width is exactly the same as the Chinese 1:2 and 1:1 relationship, so, some Chinese typesetting alignment what, directly can use these two space adjustment, such as:

<ul>    <li class= "Li" > Last name &emsp;&emsp; name: <input type= "text"/></li>    <li class = "Li" > Hand &ensp; &ensp; No: <input type= "text"/></li>    <li class= "Li" > E-mail: <input Type= "Text"/></li></ul>

When the Chinese and English mixed, use   , and   other spaces to achieve the perfect alignment of the colon is still a bit difficult, unless the English use of the same width font, so, we can use ordinary   space to do English characters width adjustment.

& #x3000;

What does "fork 3,000" mean? Haha, is actually full-width space.

Chinese fonts are equal width, the width of a full-width space is a common Chinese. Therefore, the above demo   space is changed to full-width space can also drop!

However, we can not directly in the page to play full-width space, because in most of the editor hollow lattice is transparent drop, it is easy to be deleted; In addition, HTML compression, the space is likely to be killed! Do how You need to convert the writing form.

On a Web page, there are generally 3 types of writing:

1. Direct, for example Sogou Input method enter "Copyright" – © .
2. Web characters,©
3. CharCode says:©

The above   is a   Web character with a specific name. However, I know, I do not know whether the full-width space has a corresponding & + 关键字 schematic, so, the use of tools to turn to the charcode character, that is 　 , here, also known as "fork 3,000"!

Wait a minute, you just said tools, what tools!?

Ha, the classmate is very keen, I have a small hiding tool, you can convert any character to HTML recognition format, if you are interested, you can click here: any character converted to HTML Recognition Format Tool page

Using this tool, you will find   that the   original is an adjacent sibling relationship:

•  → 
•  → 

Another popular science point about the character of the Practical Knowledge Bar:
1. The character output in HTML is used &#x with the charcode value;
2. In JavaScript file to prevent garbled escape, it is \u with the charcode value;
3. In a CSS file, such as the properties of a CSS pseudo-element content , use the \ charcode value directly.

Therefore, in the html/js/css to transfer the meaning of the "I" this character, respectively:

1. 我
2. \u6211Such asconsole.log(‘\u6211‘);
3. \6211Such as.xxx:before { content: ‘\6211‘; }

Given the direct 　 exposure of this form to HTML, it may be possible for assistive devices such as screen readers to read, thus affecting normal reading flow, so we can further optimize the use of tags, using pseudo-elements such as:

. half:before {content: ' \2002 '; speak:none;}. Full:before {content: ' \2003 '; speak:none;}

In this way, the space characters of the placeholder are unreadable and cannot be selected.

Go The wording of CSS Hollow lattice