HTML 核心内容

---恢复内容开始---

 html 5 : 

          1.移动端常用rem来表示宽高等一些数值,代替了px em cm;  

                  目的:  让移动端网页的宽高根据html的(fontSize)值的改变而改变;

                   此外 : 获取html的宽度和赋值fontSize的固定写法; 

 

    

           <script type="text/javascript">
                       var html =document.getElementsByTagName('html')[0];   //获取html;
                       var pagewidth=html.getBoundingClientRect().width;          //获取html宽度
                       console.log(pagewidth);
                       width=html.style.fontSize=pagewidth/16+"px";                   // 默认大小 常用
           </script>

 

       2.    移动端必备声明

                                     <meta name="viewport"  content=" width=device-width,user-scalable=no "/>

                                       1:    content=" width=device-width,user-scalable=no "

                                                         width=device-width---------------页面大小等于设备宽度

                                                          user-scalable=no ----------------禁止用户缩放页面

                                                         

 

<!DOCTYPE html>
<html lang="en">

<head>
<meta charset="UTF-8">
<title>Document</title>

</head>

<body>

<script type="text/javascript">
window.addEventListener("resize",function(){
var html =document.getElementsByTagName('html')[0]; //获取html;
var pagewidth=html.getBoundingClientRect().width; //获取html宽度
console.log(pagewidth);
width=html.style.fontSize=pagewidth/16+"px";
}); // 页面改变大小的时候刷新


</script>

</body>

</html>

posted @ 2018-04-09 20:03  大大怪将军010  阅读(139)  评论(0编辑  收藏  举报