我已经创建了一个网站的移动版本-简单的表格HTML和稀缺的CSS。在iOS和Android中渲染效果很好,我甚至使用了一个Meta-Width设置来获取设备的宽度。所以,它甚至使黑浆果的宽度-
但是,我遇到了一个巨大的问题——这个网站,由于一些奇怪的原因,在黑莓上——在访问链接或阅读文本之前需要缩放(虽然不需要)。我知道黑莓res大约是480px-和iOS 900,对吧?有什么建议可以让宽度保持在iOS、Android和黑莓手机之间,同时不强迫用户在黑莓手机上缩放(使用放大的缩放图标)?这是一个Javascript的东西,一个(希望不是)PHP/服务器端的东西吗?
最后,我该如何创建一个移动版本的网站-在iOS、Android和BB中都能很好地保持渲染效果,而不需要让用户“缩放>点击>内容”,只需正常浏览,“点击>内容”。但也不需要我缩小它在iOS/Android中的显示大小?
这个网站的设置方式是最终的目标;http://lisaunger.mobi/它呈现在任何地方,就像我试图呈现我的一样-但不确定如何呈现。
请给我一些建议,因为我明天要测试它们。
黑莓is:Curve 8520 v4.6.1.259 2009
这是我现在的密码:
标记:

<!DOCTYPE html PUBLIC "-//WAPFORUM//DTD XHTML Mobile 1.2//EN"
"http://www.openmobilealliance.org/tech/DTD/xhtml-mobile12.dtd">

<html xmlns="http://www.w3.org/1999/xhtml">

    <head>

        <meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>

<meta name="HandheldFriendly" content="true">
<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no">



<link rel="stylesheet" media="all" href="mobilesub.css" />

</head>

<body>

<div style="width: 480px;margin: auto;">
<div>

  <a href="index.html"><img src="img/logo.png" border="0"/></a>
  <br />

</div>


    <div>

    <a href="books.html"><img src="mobile buttons/books_off.png"   border=0  /></a>

    </div>

    <div>


     <a href="news.html"><img src="mobile buttons/news_off.png"  border=0  /></a>

     </div>

     <div>

     <a href="app.html"><img src="mobile buttons/app_off.png"  border=0 /></a>

     </div>

     <div>

      <a href="about.html"><img src="mobile buttons/about_off.png"  border=0  /></a>

     </div>

     <div>

     <a href="videos.html"><img src="mobile buttons/videos_off.png" border=0  /></a>

     </div>

     <div>


    About

 <br />

The New York Times bestseller

Contact




</div>

     <div>
     </div>
     </div>

</body>


 <script type="text/javascript" src="http://m.link.me/tracker.js"></script>
</html>

<script type="application/x-javascript">
    if (navigator.userAgent.indexOf('iPhone') != -1) {
addEventListener("load", function() {
setTimeout(hideURLbar, 0);
    }, false);
    }

    function hideURLbar() {
window.scrollTo(0, 1);
    }

</script>

CSS
body {

padding: 0px;
margin: 0px;
background-color:#000;
width: 100%;
text-align: center;
color: #fff;

}

.center-display {
    margin-left: auto;
    margin-right: auto;
}

#content {

}


#h6 {

font-size: 26px;

}

div {

    margin: 0px;
    padding: 0px;
}

更新:将站点的宽度设置为320px,并添加meta-initial scale可以让缩放功能消失,并以黑莓应有的方式呈现——但最终会从iOS和Android中获得一点效果——因为现在站点的缩放功能超过了那些设备的浏览器宽度,导致了一点水平滚动——太近了!

最佳答案

你试过用设备来定义网站吗-如果我用我的bb上网的话,它会更小,这样用户就不需要缩放了
this可能会有帮助

10-07 19:14
查看更多