What are the new units in CSS3? Detailed explanation of the latest CSS3 new units

What are the new units in CSS3? I believe that many friends who have just come into contact with CSS3 will have such questions. This chapter will introduce to you what are the new units of CSS3? Detailed explanation of the latest CSS3 new units. It has certain reference value. Friends in need can refer to it. I hope it will be helpful to you.

Some new units were introduced in css3:

ch: the width of character 0 (zero);

rem: the font-size of the root element (html element);

vw：viewpoint width, window width, 1vw is equal to 1% of the window width;

vh：viewpoint height, window height, 1vh is equal to 1% of the window height;

vmin: The smaller of vw and vh.

vmain: The larger of vw and vh.

deg-angle

Obviously vw, vh, and vmin are for mobile devices. If the window size changes, these three values ​​​​will also change accordingly.

The rem unit feels like a variant of px em. Whether it is worth using depends on your own choice: it is not as precise as px and not as flexible as em - in other words, it is more flexible than px and more accurate than em~~... …XD…

What to do if font-size is not defined?

In fact, don’t worry. According to legend, each browser has an unprecedented default font-size: 16px;, so even if you forget to define the initial value of font-size in the style file, you can still use em and rem with confidence. .

Browser support:

rem, all browsers basically support it, IE9, FF3.6, Chrome, Safari 5, and Opera 11.6 vw, vh, vmin, the browser supports and Not optimistic, IE9 supports it, Chrome currently does not support it, Chrome 20 will support it again (it seems to have been supported before?), Safari will soon support it, Opera and Firefox are not supported yet.

The above is what are the new units of CSS3? A full introduction to the latest CSS3 new units. If you want to know more about CSS3 video tutorial, please pay attention to the PHP Chinese website.

The above is the detailed content of What are the new units in CSS3? Detailed explanation of the latest CSS3 new units. For more information, please follow other related articles on the PHP Chinese website!