引导科尔多瓦应用程序全高答案

【问题标题】：boostrap cordova app full height引导科尔多瓦应用程序全高
【发布时间】：2016-12-22 14:38:32
【问题描述】：

我正在尝试使用 cordova 和 boostrap 开发一个应用程序。

薄是我有一个谷歌地图，但是当我运行应用程序时，这个地图并没有使用完整的空间。

这里是 mi html。

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<meta name="format-detection" content="telephone=no" />
<meta name="msapplication-tap-highlight" content="no" />
<!--<meta name="viewport" content="minimal-ui, user-scalable=no, initial-scale=1, maximum-scale=1, minimum-scale=1, width=device-width, height=device-height" />-->
<meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="stylesheet" type="text/css" href="css/index.css" />
<link rel="stylesheet" type="text/css" href="css/boostrap.min.css" />
<link rel="stylesheet" type="text/css" href="css/boostrap-theme.min.css">


<title>On Board</title>
</head>
<body>

<div class="container">

  <div class="row">

    

      <div data-role="header" data-position="fixed" data-tap-toggle="false" id="cabecera">
		    <div id="logo"><img id="logo_superior" src="img/inicio_b.png" /></div>
          <h1>On Board</h1>
  	   
    	<div id="triangulo"></div>
      </div>
	<!-- /header -->
  </div>

<div class="container fill">

  <div class="row">
   
      <div id="map" class="col-sm-8">      
  <!--Map load here-->
      </div>
  </div>    
</div>

	


<!-- /footer -->
</div><!-- /page -->

<script type="text/javascript" src="js/cordova.js"></script>
<script type="text/javascript" src="js/jquery.2.2.0.min.js"></script>
<script type="text/javascript" src="js/boostrap.js"></script>
<script type="text/javascript" src="js/boostrap.min.js"></script>
<script type="text/javascript" src="https://maps.googleapis.com/maps/api/js?key=AIzaSyAkmGp8fX_HqSM2ArrwRouRJV60fuA3sqo"></script>
<script type="text/javascript" src="js/index.js"></script> 
<script type="text/javascript" src="js/geolocation_gmaps.js"></script>
</body>
</html>

我该怎么办？

我正在使用 bootstrap 3 和 jquery。

【问题讨论】：

标签： android cordova google-maps twitter-bootstrap-3 responsive-design

【解决方案1】：

你可以使用 css 来拥有你想要的任何大小。

由于它被包裹在 bootstrap 中，它将继承父样式定义，例如 .row{margin-right..}

您可以将#map 放在外面并调整为您需要的值。例如：

#map {
   position : absolute;
   top : 0;
   left : 0;
   right : 0;
   bottom : 0;
   width:100%;
   height:100%;
   margin:0;
   padding:0;
}

【讨论】：