在webview ios中选择中心文本

时间:2013-10-15 17:05:30

标签: ios select webview center

我试图在我的选择中居中文字。我使用text-align在safari中工作:-webkit-center; (text-align:center;什么都不做)。但是当我运行text-align:-webkit-center;在我的phonegap webview中,文本不是居中的。

有没有人管理过在phonegap的网页浏览中的选择框中居中文字?

聚苯乙烯。中心是水平中心,而不是垂直Ds。

谢谢!

2 个答案:

答案 0 :(得分:2)

同样的问题,我在android中使用text-align-last: center;解决了这个问题,但还没有解决ios webview的问题。

答案 1 :(得分:0)

只需在webview上添加我发现的解决方案。如果你没有找到任何解决方案,你可以在angularjs上使用这个技巧或使用js将所选值与div上的文本映射,这个解决方案是完全符合角度的css但需要select和div之间的映射: / p>



var myApp = angular.module('myApp', []);

myApp.controller('selectCtrl', ['$scope',
  function($scope) {
    $scope.value = '';
  }
]);

.ghostSelect {
  opacity: 0.1;
  /* Should be 0 to avoid the select visibility but not visibility:hidden*/
  display: block;
  width: 200px;
  position: absolute;
}
.select {
  border: 1px solid black;
  height: 20px;
  width: 200px;
  text-align: center;
  border-radius: 5px;
  display: block;
}

<!doctype html>
<html lang="en">

<head>
  <meta charset="UTF-8">
  <title>Example - example-guide-concepts-1-production</title>
  <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script>
</head>
<body ng-app="myApp">
  <div ng-app ng-controller="selectCtrl">
    <div class=select>
      <select ng-model="value" class="ghostSelect">
        <option value="Option 1">Option 1</option>
        <option value="Option 2">Option 2</option>
        <option value="Option 3">Option 3</option>
      </select>
      <div>{{value}}
      </div>
    </div>
  </div>
</body>
&#13;
&#13;
&#13;

希望这对某些人有用,因为我花了一天时间在phonegap上找到这个解决方案。