Shulou(Shulou.com)06/02 Report--

Editor to share with you what unit em refers to in css3. I hope you will get something after reading this article. Let's discuss it together.

In css3, em is a unit of relative length relative to the font size of the text in the current object, that is, the size set by font-size, or relative to the default font size of the browser if the current font size of inline text is not artificially set.

The operating environment of this tutorial: windows7 system, CSS3&&HTML5 version, Dell G3 computer.

CSS em unit

Em is a unit of relative length relative to the font size of the text in the current object, that is, the size set by font-size. Its unit length is determined by the vertical length of the text of the element.

If the current font size for inline text is not artificially set, look for the parent font-size. If there is no parent or the parent does not set font-size, it is relative to the browser's default font size (16px).

For example, 1: give internal p width and height 10em directly by default

Examp-01 source code Example 01 # app {width: 10em; height: 10em; background-color: bisque;}

The screenshot of Inspect is as follows:

As you can see, the width and height of # app p are all 10em. After the browser renders, their width and height are all 160px. This is exactly 10 times the size of 16px.

This size is the 16px of the browser's default font-size.

Example-02 source code: Example 01 # app {font-size: 12px; width: 10em; height: 10em; background-color: bisque;}

Inspect screenshot:

These two examples are sufficient.

After reading this article, I believe you have a certain understanding of "what unit does em refer to in css3". If you want to know more about it, welcome to follow the industry information channel. Thank you for your reading!

Welcome to subscribe "Shulou Technology Information " to get latest news, interesting things and hot topics in the IT industry, and controls the hottest and latest Internet news, technology news and IT industry trends.