search

Home  >  Q&A  >  body text

html5 - rem和px 换算详解

迷茫迷茫2900 days ago1101

reply all(4)I'll reply

  • 高洛峰

    高洛峰2017-04-17 14:38:04

    font-size is 12px, then 1rem is 12px;

    25px is 25/12rem, which is the width and height.

    margin-top is 30/12rem

    reply
    0
  • 阿神

    阿神2017-04-17 14:38:04

    You can read this answer rem, it is better to remember this kind of thing by yourself

    reply
    0
  • PHPz

    PHPz2017-04-17 14:38:04

    If the font-size of the html root element is 100px;
    then 100px = 1rem;
    0.5rem = 50px;
    .04rem = 4px;

    It is recommended to set the font size of the root element to 100px; it is easy to convert.

    reply
    0
  • 迷茫

    迷茫2017-04-17 14:38:04

    rem is generally used for mobile layout, and the relationship with px is the fontSize of your html. Give you a self-executing function and you will understand.

    1

    2

    3

    4

    5

    6

    7

    8

    9

    <code><script type="text/javascript">

          (function (win,doc) {

            function setSize() {

              doc.documentElement.style.fontSize=20*document.documentElement.clientWidth/320+'px';

            }

            setSize();

            win.addEventListener('resize',setSize,false)

          })(window,document)

      </script></code>

    You can just introduce this and put it at the top

    reply
    0
  • Cancelreply