所有内容都在浏览器的高度和宽度内调整的响应式网页？答案

【问题标题】：Responsive webpage with all contents adjusting itself within the height and width of browser?所有内容都在浏览器的高度和宽度内调整的响应式网页？
【发布时间】：2016-04-27 18:12:45
【问题描述】：

我对网页的要求是网页的内容应该能够跨平台和跨设备查看（主要是不同的屏幕分辨率）。也应该没有滚动条（即）所有内容都应该包含在浏览器视口中。

是否可以使用引导程序或任何其他框架？

注意：不应该出现滚动条（内容应该在宽度和高度上调整。这样所有的东西都在页面内，没有任何滚动）

【问题讨论】：

是的，有可能。Bootstrap is the most popular HTML, CSS, and JS framework for developing responsive, mobile first projects on the web.-来自他们的网站。

标签： twitter-bootstrap web webpage responsive

【解决方案1】：

响应式网页示例

试试这个，

<!DOCTYPE html>
<html lang="en">
<head>
  <title>Bootstrap Example</title>
  <meta charset="utf-8">
  <meta name="viewport" content="width=device-width, initial-scale=1">
  <link rel="stylesheet" href="http://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css">
  <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.0/jquery.min.js"></script>
  <script src="http://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/js/bootstrap.min.js"></script>
</head>
<body>

<div class="container">
  <div class="jumbotron">
    <h1>Responsive Bootstrap Example</h1>
    <p>Resize this responsive page to see the effect!</p> 
  </div>

</div>
<form class="form-horizontal" role="form">
    <div class="form-group">
        <label class="control-label col-sm-3" id="txtName">Name</label>
        <div class="col-sm-3">
            <input id="txtName" type="text" class="form-control input-number" placeholder="Name" maxlength="10" />
        </div>
    </div>
<div class="form-group">
        <label class="control-label col-sm-3" id="txtEmailId">Email ID</label>
        <div class="col-sm-3">
            <input id="txtEmailId" type="text" class="form-control input-number" placeholder="Email ID" maxlength="10" />
        </div>
    </div>
    <div class="form-group">
        <label class="control-label col-sm-3">Remarks</label>
        <div class="col-sm-3 padbot3px">
            <textarea id="txtRemarks" class="form-control resizenone" rows="3" maxlength="250" placeholder="Remarks"></textarea>
        </div>
    </div>
    <div id="divConfBtn" class="form-group">
        <div class="col-sm-offset-3 col-md-3">
            <button id="btnSubmit" type="button" class="btn btn-primary" onclick="">OK</button>
        </div>
    </div>
</div>

</body>
</html>

【讨论】：

感谢您的回答。但是上面的页面创建了不同分辨率的滚动条以及 chrome 中的 iphone 设备模式。在我的问题中，我提到页面不应该创建滚动条，所有内容都应该可见。