javascript - 如何修改select中option字段的大小？

Question

在 ionic 弹出窗口中，我有一个 select html 属性，里面有 options。这是我的代码和应用于它的 CSS，我的问题是如何在 select 的整个空间上设置空白？

$scope.cat1 = ["cat1", "cat2", "cat3"];

.item-select{
        max-height: 30px;
        border-radius: 10px; 
        // width: 100%;
}

.label-police{
        font-family: "Avant Garde", Avantgarde, "Century Gothic", CenturyGothic, "AppleGothic", sans-serif;
        font-weight:300;
        background-color:rgba(172,231,242, 0.1);
}

.top-input{
        background-color:rgba(206,240,246, 0.9);
        font-weight:300;
        border-radius: 4px 4px 4px 4px !important;
}

<label class="label-police">Cat :</label>
<div class="spacer" style="width: 100%; height: 2px;"></div>
<label class="item item-select">
<select class="top-input"><br><option class="top-input" ng-repeat="cat in cat1">{{ cat }}</option></select></label>

Answer 1

也许可以将 width: 100%; 添加到 .top-input 样式中。另外，如果您想完全调整它，请将 .item div padding 设置为 0。

Here an approach