<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "">
<html xmlns="">
<head>
<meta http-equiv="Content-Type" content="text/htmlcharset=utf-8" />
<title>无标题文档</title>
<style type="text/css">
*{
padding:0
margin:0
}
table tr td{
border:solid 1px red
}
</style>
<script type="text/javascript">
var geometry={}
if(window.innerWidth){
geometry.getViewportWidth=function(){
return window.innerWidth
}
geometry.getViewportHeight=function(){
return window.innerHeight
}
}else if(document.documentElement &&document.documentElement.clientWidth){
geometry.getViewportWidth=function(){
return document.documentElement.clientWidth
}
geometry.getViewportHeight=function(){
return document.documentElement.clientHeight
}
}else if(document.body.clientWidth){
geometry.getViewportWidth=function(){
return document.body.clientWidth
}
geometry.getViewportHeight=function(){
return document.body.clientHeight
}
}
function change(){
document.getElementById('test').style.height=geometry.getViewportHeight()+'px'
}
window.onload=function(){
change()
window.onresize=function(){
change()
}
}
</script>
</head>
<body>
<table width="100%" cellpadding="0" cellspacing="0" id="test">
<tbody>
<tr><td>dddd</td><td>dddd</td><td>dddd</td><td>dddd</td><td>dddd</td></tr>
<tr><td>dddd</td><td>dddd</td><td>dddd</td><td>dddd</td><td>dddd</td></tr>
<tr><td>dddd</td><td>dddd</td><td>dddd</td><td>dddd</td><td>dddd</td></tr>
<tr><td>dddd</td><td>dddd</td><td>dddd</td><td>dddd</td><td>dddd</td></tr>
</tbody>
</table>
</body>
</html>
<meta name=”viewport” content=”width=device-width, initial-scale=1, maximum-scale=1″>width:控制 viewport 的大小,可以指定的一个值,如果 600,或者特殊的值,如 device-width 为设备的宽度(单位为缩放为 100% 时的 CSS 的像素)。
height:和 width 相对应,指定高度。
initial-scale:初始缩放比例,也即是当页面第一次 load 的时候缩放比例。
maximum-scale:允许用户缩放到的最大比例。
minimum-scale:允许用户缩放到的最小比例。
user-scalable:用户是否可以手动缩放
你用js来控制就行了先获取屏幕的宽 然后减去你的页面宽 然后再除以二就行
屏幕宽度:screen.width
我用一个div来演示了:
<div id="div"></div>
<script>
function centers(){
var divs = document.getElementById("div")
document.getElementById("div").style.marginLeft = (screen.width -divs.offsetWidth)/2+"px"
}
</script>
欢迎分享,转载请注明来源:内存溢出
评论列表(0条)