Web--app adaptive rem;

CSS3 Rem; try to write a little bit without considering IE

Encounter problems: In HTML5 development app encountered some adaptive problems;

Solution: Use CSS3 new unit REM;

Open URL http://mxd.tencent.com/wp-content/uploads/2014/11/rem.html

On the left, enter the size of the artist transduction I am here 720PX (width:720px; The semicolon must be written; the width of the designs below should also be 720); The red box below (now on the market mainstream mobile phone screen) is all checked;

Click on the Blue Conversion button, and create CSS on the right;

Copy the code into your own CSS, and then refer to CSS (referencing link is the best last quote, or it may not come out);

Converts a picture font code previously written in PX into REM;

1rem=20px on the right 720px;

So, if the artist in accordance with 720PX to send you the size of the picture is width:200px;height:200px;

So now the size is

. Xxx{width:10rem;height:10rem;}

This style can adapt to different mobile phone screen size; The web is the same ~

Web--app adaptive rem;