如何在其中创建具有不同样式单词的 html 选项标签？

Question

我想要一个带有选项的选择框，其中一个单词在最左边，第二个单词在最右边。

例如

<select>
  <option>Suzuki Car</option>
  <option>Volvo Bus</option>
</select>

在上面的例子中，“suzuki”应该向左浮动，“Car”应该向右浮动。 我也希望“铃木”大胆而不是汽车。

Answer 1

你不能这样做，因为<option> 标签不能有子元素。请read documentation:

内容类别：无。

允许的内容：文本，可能带有转义字符。

Answer 2

向您展示一个示例伪代码 --

如果你使用 jQuery，这种风格一定有办法：

for each <option> in <select>{
   split(<option-value>)[0].css('text-align', 'left');
   split(<option-value>)[1].css('text-align', 'right');
}