The method of sharing CSS character encoding to quickly solve garbled characters

The following small series for everyone to bring a share of CSS character encoding caused by the rapid resolution of garbled methods. Small series feel very good, now share to everyone, also for everyone to make a reference. Let's take a look at it with a little knitting.

The CSS invalidation principle caused by garbled characters:

Because a Chinese is two characters, in the case of inconsistent coding will cause the character of the "Re" combination (half of the characters encoded characters and the subsequent combination of characters to generate a new "text") caused the original end of the "mutation", resulting in the end of the symbol can not be found, so that the subsequent CSS will be invalidated.

The trick in 1:css is that the CSS character encoding is inconsistent with the character encoding of the page, so the most straightforward method is to make the character encoding consistent. Specify the CSS encoding type, example: @charset "Utf-8"; (Specifies that the encoding type is utf-8 and must be written in the first line of the CSS file)

Small tricks 2:css appear in the garbled characters are caused by Chinese characters, so as long as not to write English, will not produce "garbled caused by CSS failure" this situation

Apart from the above two tips, we are planing root, we will find that "garbled" usually comes from the following two situations.

First, Chinese comments caused garbled

CSS comments are:/* some comments */

Garbled instances:
Normal code:/* Three kanji */
Caused by garbled:/* Juan Corporation 眽 Ying?
Browser Environment: IE6
html:gb2312
CSS: No encoding specified, actually resolves to utf-8

The above example is garbled block the CSS comment Terminator, so that the back of the CSS content within the annotation range, resulting in the failure of CSS
Precautionary measures: strengthening annotations

Example:
Normal code:/**** three Kanji ****/
Caused by garbled:/**** Juan Corporation 眽 Ying? ***/
This enhanced version of the note prevents garbled the final terminator of the comment "mutation", you can write CSS, in advance to prevent

Second, the Chinese font caused garbled
CSS specified font: font-family: "Chinese font";

Garbled instances:
Normal code: font-family: "Blackbody"
Caused by garbled: font-family: "Hazel Contact 綋"
Browser Environment: IE6
html:gb2312
CSS: No encoding specified, actually resolves to utf-8

The above example is garbled to make the font name garbled, causing the specified font to become invalid. The consequences of this problem do not seem very serious, but in fact, there is a garbled in the back of the quotation mark "mutation" situation, so that the back of the CSS are in the font of the quotation marks, so that the following CSS all invalid.
Precautions: Use a font alias (so the browser is recognizable)

Example:
Normal code: font-family: "Simhei" (font-family: "\9ed1\4f53")
Browser parsing: font-family: "Simhei" (font-family: "Blackbody", IE6 still font-family: "\9ed1\4f53" but font parsing is shown in boldface)
Use aliases, bypassing the use of Chinese, so as to avoid garbled

CSS Chinese font (font-family) List

Some of Windows:

Blackbody: Simhei

Song Body: SimSun

New song body: Nsimsun

Imitation: Fangsong

Italics: Kaiti

Imitation _gb2312:fangsong_gb2312

Italic _gb2312:kaiti_gb2312

Microsoft Elegance Blackbody: Microsoft Yahei

Some of the things that can be produced by office:

Official script: Lisu

Young Circle: Youyuan

Chinese fine Black: Stxihei

Chinese Italic: Stkaiti

XXFarEastFont-Arial: Stsong

XXFarEastFont-Sung: Stzhongsong

XXFarEastFont-Imitation: Stfangsong

Founder Shu Body: Fzshuti

Founder Arial: Fzyaoti

Chinese Choi Wan: Stcaiyun

Chinese Amber: Sthupo

Chinese script: Stliti

XXFarEastFont-Xingkai: Stxingkai

Chinese New Wei: Stxinwei

Add:

After you use italics _gb2312, imitation _gb2312, the corresponding font may no longer appear in Windows 7/vista/2008.

This is because there are italics, imitation in Windows 7/vista/2008, there is no italic _gb2312, imitation _gb2312 by default, and the font name differs from "_gb2312".

-----------------------------------------------------------

The wording of Chinese fonts in CSS

For the wording of the font, feel the need to explain:

Body

button, input, select, textarea {

FONT:12PX/1 Tahoma, Helvetica, Arial, "\5b8b\4f53", Sans-serif;

}

"\5b8b\4f53″" is "Song Body". In Unicode, it is not necessary to SimSun because some versions of Firefox and Opera do not support the SimSun notation. Learn more about Font literacy:

Aliases for fonts

A font in the system is allowed to exist in multiple alias forms. For example, under Windows, Georgia can also be named with Georgia MS, which is actually the same font. The official name of the song body is SimSun, and the "song Body" is just its nickname.

By specification, the browser should be able to automatically identify the font alias and map it to the correct font file. For example, Font-famliy:simsun and font-family: "Song body" should have an equivalent effect. Unfortunately, it seems that many browsers do not correctly execute the previous definition ...

Therefore, in view of browser compatibility, we need to use "Arial", transcoding into Unicode form can guarantee that there is no problem under any coding.

-----------------------------------------------------------

To make it easy for your friends to use quickly, the following table lists some of the Unicode encodings for commonly used Chinese fonts:
Blackbody \9ed1\4f53
Song Body \5b8b\4f53
Italic \6977\4f53
Microsoft ya Black \5fae\8f6f\96c5\9ed1