标签：单位 ready font html style utf-8 logs blog java
html:
<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title></title> <script type="text/javascript" src="js/jQuery.js"></script> <script type="text/javascript" src="js/js.js"></script> <style type="text/css"> /* * 设置高度自适应，让在普通分辨率下和大屏分辨下，都能铺满屏。 1.设置最外层html的 font-size: 12px; */ html,body{font-family: "微软雅黑";font-size: 12px;width: 99%;height: 100%; min-width: 1340px; background-color: #04101E;margin: 0 auto;} /* 2.高度用rem单位。 最外层html的 font-size: 12px;如果div的height是24px，那用24/12=2rem；相当于1rem=12px； */ .div1,.div2,.div3{ width: 100%; height: 18.33rem; } .div1{background-color:#ff1aaf ;} .div2{background-color:#AA86E6 ;} .div3{background-color:#189189 ;} </style> </head> <body> <div class="div1">撑起div的高度</div> <div class="div2">撑起div的高度</div> <div class="div3">撑起div的高度</div> </body> </html>
js:
// 放到头部（初始化位置 $(document).ready(function(){ setRem(); $(window).resize(function(){ setRem(); }); }) function setRem(){ //alert("12"); var sWidth=document.documentElement.clientWidth; var sHeight=document.documentElement.clientHeight; if(sWidth>1366){ $("html").css("font-size",sWidth/1366*12+"px"); return; } if(sHeight>768){ $("html").css("font-size",sHeight/768*12+"px"); } };
标签：单位 ready font html style utf-8 logs blog java
原文地址：http://www.cnblogs.com/Han39/p/7251204.html
