Question

我不确定这是否可能，但我有一个案例，我想在HTML选择标记的选项中加粗部分（不是全部）文本。

我尝试使用b标签以及强力标签，但没有运气（在Chrome上）。 CSS可能有用，但由于它在元素级别工作，我不知道如何以这种方式去做。

有没有办法做到这一点？

Answer 1

没有;这是不可能的。

相反，您可以使用Javascript制作虚假的下拉列表。

Answer 2

因为chrome不允许在选项标签上加粗字体。你可以使用像

这样的text-shadow属性

text-shadow：0px 0px 0px black;

它将提供相同的粗体外观并适用于所有浏览器

Answer 3

我认为为时已晚，但这件事对我有用。将属性'font-weight：bolder'应用于选项标记，使其中的文本变为粗体，而不使用任何html标记。

<option value="optionValue" class="bold-option">
.bold-option{font-weight: bolder;}

Answer 4

不，这是不可能的。你有两个选择：

1）使用<optgroup>为您正在做的事情创建描述性标题（这不太可能有帮助）。

2）使用JavaScript模拟下拉菜单。我不确定，但我认为jQuery UI可能有一个下拉菜单脚本。

Answer 5

简单的解决方案：

<select>
  <option>Simple</option>
  <option class='bolden'>Bold</option>
  <option>Simple</option>
</select>
<style>
  .bolden{font-family:"Arial Black"}
</style>

示例：https://jsfiddle.net/hnzhbz69/

Answer 6

在选择中加粗第n个选项。

在css中无法做到这一点。如果仍需要区分选项，请使用颜色和背景。

.diff-option {
   color : grey;
}
.other-options{
   color:white
   background: ...
}

Answer 7

使用CSS是可以的

   option[value='4']{
    font-weight:bold;
}
/*
Here you can used also :nth of the options that you need to apply specific css like
option:nth-child(1), option:nth-child(4) {
    font-weight:bold;
}
*/

<select>
<option value='1'>first</option>
<option value='2'>Second</option>
<option value='3'>Third</option>
<option value='4'>Fourth</option>
<option value='5'>Fifth</option>
</select>

Answer 8

好吧，你可以在firefox中使用<strong>或<b>，但它不适用于Chrome或IE浏览器（不会其他任何其他内容）

Answer 9

尝试用<span id="wrap">Some text</span>在css中包装文本 #wrap {font-weight: bold}

HTML选择中的部分粗体文本

9 个答案: