px is absolute unit, does not support the zoom of IE, EM is relative unit. EM refers to the high font, any browser default font height is 16px. So the unmodified browser is compliant with: 1EM=16PX. So 12px=0.75em, 10px=0.625em. To simplify the conversion of font-size, you need to declare font-size=62.5% in the body selector in the CSS, which makes the EM value 16px*62.5%=10px, so 12px=1.2em, 10px=1em, That means you just have to divide your original PX value by 10 and then put EM in as the unit. EM has the following characteristics: 1. The value of EM is not fixed; 2. EM inherits the font size of the parent element. Rewrite steps: 1. The body selector declares font-size:62.5%;2. Divide your original PX value by 10 and replace it with EM as a unit; simply, if you need to solve the problem in just two steps, no one will be using PX. After these two steps, you will find that your website font is too big to imagine. Because the value of EM is not fixed and inherits the size of the parent element, you might set the font size to 1.2em, or 12px, in the content div. Then you also set the selector p font size to 1.2em, but if p belongs to the content of the child, the font size of P is not 12px, but 1.2em= 1.2 * 12px=14.4px. This is because the font size of the content is set to 1.2em, the EM value inherits the size of the body of its parent element, which is 16px * 62.5% * 1.2=12px, and P as its child, EM inherits the content of the font high, that is, 12px. So the 1.2em of P is no longer 12px, but 14.4px. 3. Recalculate the EM values of the enlarged fonts. Avoid duplicate declaration of font size, that is, avoid the above mentioned 1.2 * 1.2 = 1.44 phenomenon. For example, when you declare a font size of 1.2em in #main, you can only have 1em when declaring the font size of p, not 1.2em, because this em is not em, it becomes 1em=12px because it inherits the font height of #content. Strange 12px Chinese characters in the completion of the EM conversion will also find a strange phenomenon, is obtained by the above method 12px (1.2em) size of Chinese characters in IE does not equate directly with 12px defined font size, but slightly larger. This problem I have solved, you just need to change 62.5% in the body selector to 63% will be able to display the normal.
A few notes about EM,REM,PX