css 选择某些 <option> 上的粗体下拉列表
声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow
原文地址: http://stackoverflow.com/questions/9078927/
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 select dropdown bold on some <option>'s
提问by user991830
On a select dropdown, I need to make certain items 'strong/bold'.
在选择下拉列表中,我需要使某些项目“强/粗”。
How can I do this?
我怎样才能做到这一点?
Example of what I ideally require:
我理想情况下需要的示例:
<option value="#"><strong>Andorra</strong></option>
<option value="#">--Grandvalira</option>
<option value="#">--Vallnord</option>
<option value="#"><strong>Austria</strong></option>
<option value="#">--Amadé</option>
<option value="#">--Bad Kleinkirchheim</option>
<option value="#">--Mallnitz</option>
采纳答案by Sotiris
you could use :nth-child(N)
你可以用 :nth-child(N)
option:nth-child(1), option:nth-child(4) {
font-weight:bold;
}
Demo:http://jsfiddle.net/Sotiris/sqshN/
演示:http : //jsfiddle.net/Sotiris/sqshN/
Find more info and browser support for this pseudo-class at http://reference.sitepoint.com/css/pseudoclass-nthchild
在http://reference.sitepoint.com/css/pseudoclass-nthchild 上查找有关此伪类的更多信息和浏览器支持
回答by Royi Namir
You actually can't.
你实际上不能。
The closestthing (you can't choose a bold item)
在最近的事情(你不能选择一个大胆的项目)
<optgroup label="Swedish Cars">
<option value="volvo">Volvo</option>
<option value="saab">Saab</option>
</optgroup>
<optgroup label="German Cars">
<option value="mercedes">Mercedes</option>
<option value="audi">Audi</option>
</optgroup>
Which gives you this:
这给了你这个:
http://www.w3schools.com/tags/tryit.asp?filename=tryhtml_optgroup
http://www.w3schools.com/tags/tryit.asp?filename=tryhtml_optgroup
You can also build one of your own but it won't be input an input tag (you should use inputs of your own).
您也可以构建自己的一个,但不会输入输入标签(您应该使用自己的输入)。
回答by Ben Davis
Using css in the works as a quicker, easier alternative
在作品中使用 css 作为更快、更简单的替代方案
<option value="value" style="font-weight: bold;">SELECT ME</option>
回答by Mani
This also works (Firefox 50 and Chrome 55). Items 3 and 5 are shown in bold
这也适用(Firefox 50 和 Chrome 55)。第 3 项和第 5 项以粗体显示
<style>
.bld {font-weight:bold;}
</style>
<select>
<option value = "1">Kanakangi
<option value = "2">Ratnangi
<option class = "bld" value = "8">Hanumatthodi
<option value = "9">Dhenuka
<option class = "bld" value = "15">Mayamalavagowla
<option value = "16">Chakravaaham
</select>
回答by Evan Lalo
You could do it with jQuery.
你可以用jQuery来做。
$('#Your select').append($("<option></option>").attr.css("font-weight" , "bold").html("Bold Text"));
You'd have to add some logic to determine which options to bold, obviously.
显然,您必须添加一些逻辑来确定要加粗的选项。