Html CSS,覆盖所有选择下拉列表的高度?
声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow
原文地址: http://stackoverflow.com/questions/3476314/
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
CSS, overwrite height of all select dropdowns?
提问by Tom
how would i reference, so i could overwrite, all of the select boxes so i can overwrite the default height? I'm familiar when i create elements using a class, but im unsure on this?
我将如何引用,以便覆盖所有选择框,以便覆盖默认高度?当我使用类创建元素时,我很熟悉,但我不确定这一点?
回答by Topera
100% JS solution (with jquery)
100% JS 解决方案(使用 jquery)
$("select").height("120px");
100% JS solution (without jquery)
100% JS 解决方案(没有 jquery)
var selects = document.getElementsByTagName("select");
for(i = 0;i < selects.length; i++) {
selects[i].style.height = "120px";
}
100% CSS solution
100% CSS 解决方案
select {
height: 100px !important;
}
回答by Pekka
You mean the menu that pops up when dropping down a native select
element?
你是说下拉原生select
元素时弹出的菜单?
I don't think you can influence that at all, that's entirely up to the browser.
我认为您根本无法影响它,这完全取决于浏览器。
What you might be able to influence - it should work in all current browsers - is the select
itself:
您可能会影响的东西 - 它应该适用于所有当前浏览器 - 是它select
本身:
select { height: .... }
or each option (Should work in Firefox; spotty support otherwise)
或每个选项(应该在 Firefox 中工作;否则支持参差不齐)
select option { height: .... }
回答by Delan Azabani
This should do the trick:
这应该可以解决问题:
select { height: 60px; }
Replace 60
with your desired height.
替换60
为您想要的高度。
回答by Delan Azabani
Try this:
尝试这个:
select {height:100px;}
回答by Junaid Zaheer
100 % work in my scenerio ..
100% 在我的场景中工作..
<select onfocus='this.size=10;' onblur='this.size=1;'
onchange='this.size=1; this.blur();'>
回答by umair
You can easily do this using css use line-height and font-size.
您可以使用 css 使用 line-height 和 font-size 轻松做到这一点。
select {
line-height: 1em;
font-size: 14px;
}
回答by Sotiris
The best way is to give a class on your select element. <select name="nameforyourselect" class="myclass"></select>
最好的方法是在你的选择元素上给一个类。 <select name="nameforyourselect" class="myclass"></select>
Then on your css set the height, for example .myclass{height:30px;}
this will give height 30px on all elements with class name myclass. I suggest you this way, because you may wish to create another select element with another height. So you just set other class on it and define it on your css.
然后在你的 css 上设置高度,例如.myclass{height:30px;}
这将在所有类名为 myclass 的元素上给出高度 30px。我建议你这样做,因为你可能希望创建另一个具有另一个高度的 select 元素。因此,您只需在其上设置其他类并在您的 css 上定义它。