Article directory
rem concept
r – stands for root root, which means html.
em-relative unit, that is, the font size unit relative to html.
When the html size is not set, 1rem=16px
Rem implements font size adaptation
<script>
let self_adaption=()=>{
let w = document.documentElement.clientWidth;
let n = (20*(w/320)>40?40+"px":20*(w/320)+"px")
document.documentElement.style.fontSize = n;
}
window.addEventListener("load",self_adaption)
window.addEventListener("resize",self_adaption)
</script>
<body>
<div>hello world!</div>
</body>
<style>
div{
font-size: 1rem;
}
</style>
rem elastic layout
A set of schemes, using windows of different sizes and resolutions, can show better results
Use % or rem units