如何使网站响应您的Android手机屏幕大小?

时间:2017-05-18 07:03:22

标签: android twitter-bootstrap

我正在尝试将我的网站转换为Android应用程序。我正在使用Bootstrap来响应我的网站。

while ($row = mysqli_fetch_assoc($result)) {
    echo "<div class='row'>";

    echo"<div class='col-lg-3 col-md-3 col-sm-3 col-3'>";
        echo"<strong>".$row["BookID"]."</strong>";
    echo "</div>";
    echo "<div class='col-lg-6 col-md-6 col-sm-7 col-7'>";
            echo "<div class='row'><strong>".$row["Bookname"]."</strong></div>";
            echo "<div class='row'>".$row["Authorname"]." [ ".$row["Edition"]." ]</div>"; 
    echo "</div>";
    echo "<div class='col-lg-3 col-md-3 col-sm-2 col-2'>";
            echo "<input type='checkbox' name='bookids[]' value='".$row["BookID"]."'>";
    echo "</div></div><hr>";

}
echo "<br>
<input type='submit' class='btn btn-info' value='Submit Renewal'></center></div>";
}

下面显示的是我在浏览器和Android应用程序中输出的屏幕截图。

browser output shown below

 browser output looks like this

android app output is shown below my app looks like this

请帮助我解决这个问题。

1 个答案:

答案 0 :(得分:1)

您需要添加

<meta name="viewport" content="width=device-width, initial-scale=1.0">

<head></head>标记内

您需要确保没有为页面中的某些元素设置固定的宽度或高度