Mobile terminal rem responsive layout development
rem is a commonly used length unit in mobile WEB APP development rem is a relative length unit, relative to the root element (html element) font-size
The multiple of the calculated value The default value of font-size of the root element (html element) is 16px; 1rem=16px;
For ease of calculation, we generally set the font-size value of the root element to 100px.
In the webpage, we will use the following code to dynamically modify the value of font-size to adapt the webpage to devices of different sizes.
<script type="text/javascript">
function refreshRem() {
var desW = 750,
winW = document.documentElement.clientWidth,
ratio = winW / desW;
document.documentElement.style.fontSize = ratio * 50 + 'px';
}
refreshRem();
window.addEventListener('resize', refreshRem);
</script>