Html 如何设置选择框下拉高度
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/23534440/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
How to Set Height for the Drop Down of Select box
提问by Atif Azad
my selectbox is showing scroll when number of options are more than 20 i just want to show scrol in when options are more than 10
我的选择框在选项数量超过 20 时显示滚动 我只想在选项超过 10 时显示滚动
<select>
<option>1</option>
<option>2</option>
<option>3</option>
<option>4</option>
<option>5</option>
<option>6</option>
<option>7</option>
<option>8</option>
<option>9</option>
<option>10</option>
<option>11</option>
</select>
回答by reuelab
Try adding this to the <select>element:
尝试将其添加到<select>元素中：
onfocus='this.size=10;'
onblur='this.size=1;'
onchange='this.size=1; this.blur();
like:
喜欢：
<select onfocus='this.size=10;' onblur='this.size=1;'
onchange='this.size=1; this.blur();'>
回答by Vince C
Seriously guys, there is a size attribute for the selectelement:
说真的，select元素有一个 size 属性：
<select size="10">
<option>1</option>
<option>2</option>
<option>3</option>
<option>4</option>
<option>5</option>
<option>6</option>
<option>7</option>
<option>8</option>
<option>9</option>
<option>10</option>
<option>11</option>
</select>
FIDDLE:http://jsfiddle.net/UR46N/
小提琴：http : //jsfiddle.net/UR46N/
回答by Seemu Saikia
In Case of setting size (height/width) and fitting the selection list in the pop up then try the following in VFPage- Salesforce:
如果在弹出窗口中设置大小（高度/宽度）并适合选择列表，请在 VFPage-Salesforce 中尝试以下操作：
<apex:selectList onclick="this.size=5;" required="true" id="form-element-05" value="{!scheduleBatchWrapper.hour}" size="1" styleClass="slds-select selectObj slds-m-left_medium slds-m-top_medium schTime" style="max-width:50%; margin-bottom:5% margin-top:5%,max-height:20%" >
<apex:selectOptions value="{!scheduleBatchWrapper.hoursList}"></apex:selectOptions>
</apex:selectList>
// here onclick="this.size=5;" will set the size to 5 when you click on the selectList. //it works fine for Chrome,Firefox,Edge.
// 这里 onclick="this.size=5;" 当您单击 selectList 时，会将大小设置为 5。//它适用于 Chrome、Firefox、Edge。
Thanks
谢谢
回答by Senthil Kumar
<select>
<option value="volvo">Volvo</option>
<option value="saab">Saab</option>
<option value="mercedes">Mercedes</option>
<option value="audi">Audi</option>
</select>
option {
padding: 5px 0;
}
回答by Pranav
check this .i have implemented scroll to your select box. http://plnkr.co/edit/XiKZ4X2DGYTJDjJX2xvw?p=preview
检查这个。我已经实现了滚动到您的选择框。http://plnkr.co/edit/XiKZ4X2DGYTJDjJX2xvw?p=preview
回答by Aradhna
Why dont you add CSS style to specify the width and height of the select. Check the article--> http://cssdeck.com/labs/styling-select-box-with-css3
为什么不添加CSS样式来指定选择的宽度和高度。检查文章--> http://cssdeck.com/labs/styling-select-box-with-css3
回答by Amit
use below css
使用下面的css
select{ padding:5px;}
