html - CSS如何增加选择框元素之间的行距

Question

我想增加选择框元素之间的行间距。

我尝试了 line-height 和 min-height 但这确实会影响选择框元素的间距。

我可以使用哪个属性？

.input {
    padding-bottom:5px;
    margin-right:8px !important;
    margin:4px;
}

这里我有 min-height:

select, textarea {
    background: #eee;
    border: 1px solid #aaa;
    border-right-color: #ddd;
    border-bottom-color: #ddd;
    -webkit-box-shadow: none;
    -moz-box-shadow: none;
    box-shadow: none;
    width: 100%;
    min-height: 30px;
    font-weight: normal;
}

这里我有行高:

select, textarea { 
    display: inline-block;
    height: 20px;
    padding: 4px 6px;
    margin-bottom: 5px;
    font-size: 12px;
    line-height: 20px;
    color: #555555;
    vertical-align: middle;
    -webkit-border-radius: 4px;
    -moz-border-radius: 4px;
    border-radius: 4px;
}

Answer 1

对于使用“size”属性(大小大于 0)的“select”元素，尝试在选项上使用填充:

<select multiple>
    <option style="padding: 10px" value="1">Option 1</option>
    <option style="padding: 10px" value="2">Option 2</option>
    <option style="padding: 10px" value="3">Option 3</option>
    <option style="padding: 10px" value="4">Option 4</option>
</select>