2

我试图在我的选择中居中文本。我已经使用 text-align:-webkit-center; 在 Safari 中工作了。（文本对齐：中心；什么都不做）。但是当我运行 text-align:-webkit-center; 在我的 phonegap webview 中，文本没有居中。

有没有人设法在 phonegap 的 web 视图的选择框中将文本居中？

附言。中心是水平中心，而不是垂直 Ds。

谢谢！

4

2 回答 2

2

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

于 2016-03-23T12:21:23.493 回答
0

Just adding the solution I found to do that on webview. If you didn't find any solution, you can use this trick on angularjs or using js to map selected value with a text on the div, this solution is full css compliant on angular but need a mapping between select and div:

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>

Hope this could be useful for someone as it took me one day to find this solution on phonegap.

于 2016-03-25T13:43:05.653 回答