in rem

in

  • em is a relative unit, it needs a reference attribute, which refers to the font size of the current element
  • Reference value: the value of the font-size of the HTML root tag
    Insert picture description here

rem

  • relative unit of rem,
  • Reference value: the value of the font-size of the HTML root tag
  • The principle of rem layout:
    dynamically modify the font-size value in the html root tag.
    Implementation method:
    1. Through js
    2. Through vw.
    Insert picture description here
    Insert picture description here

vw / vh

  • There are also disadvantages to using percentage layout:
    1. It is inconvenient to calculate the percentage.
    2. It is not convenient to use when multi-layer nesting.

  • vw: 1vw = one hundredth of the screen width.
    vh: 1vh = one hundredth of the screen height.

  • Difference: The
    percentage refers to the parent box
    vw/vh refers to the screen.
    Insert picture description here

Guess you like

Origin blog.csdn.net/weixin_53125457/article/details/111642938
rem