Jquery 你知道一些关于'；iphone css布局'，你能帮我改进代码吗_Jquery_Iphone_Css_Layout

Jquery 你知道一些关于'；iphone css布局'，你能帮我改进代码吗

jquery iphone css layout

Jquery 你知道一些关于'；iphone css布局'，你能帮我改进代码吗,jquery,iphone,css,layout,Jquery,Iphone,Css,Layout,我想在iphone上创建一个网页但我不能用简单的方式完成这是我的代码： <!DOCTYPE html PUBLIC "-//WAPFORUM//DTD XHTML Mobile 1.0//EN" "http://www.wapforum.org/DTD/xhtml-mobile10.dtd"> <html xmlns="http://www.w3.org/1999/xhtml" > <head> <meta http-equ

我想在iphone上创建一个网页

但我不能用简单的方式完成

这是我的代码：

<!DOCTYPE html PUBLIC "-//WAPFORUM//DTD XHTML Mobile 1.0//EN" "http://www.wapforum.org/DTD/xhtml-mobile10.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" >
    <head> 
        <meta http-equiv="Content-Type" content="text/html; charset=UTF-8"> 
        <meta name="viewport" content="width=device-width,minimum-scale=1.0,maximum-scale=5.0,user-scalable=yes">

    </head>
<body onorientationchange="updateOrientation();" onload=updateOrientation()>
<div id="a">
    <input id='ab' type="button" value="button" />
</div>

<div id=b style="display: none">sssadwq dwqdqw</div>

<style type="text/css">
*{
    margin:0;
    padding:0;
    }


/* Reposition on orientation change */
body.landscape{
    height: 268px;
}
body.landscape #a{
    height:134px;
    line-height:134px;
    }

body.landscape #b{
    height:114px;
    width:470px;
    }
body{
    height: 416px;
}
#a{
    line-height:208px;
    height:208px;
    text-align:center;

}
#b{
    height:198px;
    width:310px;
    background:red;
    border:5px solid black;
}


</style>
<script src="jquery-1.4.2.js" type="text/javascript"></script>
<script type="text/javascript">

function updateOrientation() {
      var orientation = window.orientation;
            switch (orientation) {
                    // If we're horizontal
          case 90:
          case -90:

          // Set orient to landscape
          $(document.body).addClass("landscape");
          break;  

          // If we're vertical
          default:

          // Set orient to portrait
          $(document.body).removeClass("landscape");
          break;
      }
}

$('#ab').click(function(){
    if($('#b').css('display')=='none')$('#b').css('display','block')
    else $('#b').css('display','none')
    })
</script>
</body>
</html>


sssadwq dwqdqw
*{
保证金：0；
填充：0；
}
/*方向更改时重新定位*/
身体景观{
高度：268px；
}
身体、风景{
高度：134px；
线高：134px；
}
身体·景观#b{
高度：114px；
宽度：470px；
}
身体{
高度：416px；
}
#a{
线高：208px；
高度：208px；
文本对齐：居中；
}
#b{
高度：198px；
宽度：310px；
背景：红色；
边框：5px纯黑；
}
函数updateOrientation（）{
var方向=window.orientation；
开关（方向）{
//如果我们是水平的
案例90：
案例-90：
//面向风景
$（document.body）.addClass（“景观”）；
打破
//如果我们是垂直的
违约：
//将方向设置为纵向
$（document.body）.removeClass（“横向”）；
打破
}
}
$（'#ab'）。单击（函数（）{
if（$（'b'）.css（'display'）='none'）$（'b'）.css（'display'，'block'））
else$（'b'）.css（'display'，'none'））
})

它使用的固定数字要多得多，这不是最好的方法，我认为最好的方法是

越来越多地使用百分比

你能帮我做吗

谢谢

下载xCode并使用DashCode。它将为你做这项工作。或者，试试看。

我会调查。。。一个非常好的jQuery插件，它将为您做很多艰苦的工作