[CSS3 tutorial] explanation of relative unit rem, css3rem
Author: zhanhailiang Date:
Definition
CSS3 adds a relative unit rem. Its official definition is as follows:
Font size of the root element
Difference in rem, em, px units
Both rem and em units are relative sizes, and px is absolute. The difference is that
- Em is based on the current element (if it is not set, it inherits its parent element) font-size, which may cause some combination problems;
- Rem is only relative to the font-size of the root element, that is, you only need to set the font-size of the root element, and other elements can use the rem unit to set the corresponding percentage;
Compatibility
At present, all browsers except IE8 and earlier versions support rem. For browsers that do not support it, the solution is very simple, that is, to write an absolute unit statement. These browsers ignore the font size set with rem.
Example
<Html> Read more
- (W3C) EM, PX, PT, CM, IN...
- Understand the unit of length in css
- CSS3 Tutorial: Explanation of relative unit rem
- IE8 HACK Introduction