Mobile web page production_html/css_WEB-ITnose

What is the difference between mobile webpage production and computer webpage production? How is the mobile webpage adaptive?

Reply to the discussion (solution)

Use % and try to avoid px

Another one is @media(max-height: 480px){

}

Same as above, mobile phone The main problem faced by mobile phones varies in height. Width adaptive is easy to handle. I often use JS to calculate the height, and use % for font size.

You can use jquery to control the style. Generally, it is adapted to 4 and 6plus as the standard. Use Google Chrome to debug. Pay special attention to Xiaomi phones. style.

Encapsulate a js yourself, calculate the width ratio between the design drawing and the screen, and assign the value in the form of a custom attribute (the value obtained from the design drawing). When the page is loaded, take out the attribute value and multiply it by the ratio. It is simpler to pay for the style. Otherwise, each page has to be calculated using js, which is very complicated!

The simplest one is percentage