您无法在标准选择列表中对您的样式进行精细化处理。这将需要一个动态替换（使用 Javascript 创建和控制）来代替您的标准选择，并来回提供值。

例如，以下内容更清楚地说明了我的观点。您必须拥有一组完全不同的 HTML 元素，您可以以这种方式设置样式，例如，包含无序列表的 div。请注意，选项 6 的样式为粗体。

<div id="list-simulation">
  <ul>
    <li>Option 4</li>
    <li class="selected">Opt<strong>ion 5</strong></li>
    <li>Option 6</li>
  </ul>
</div>

附加的 Javascript 逻辑拦截对列表项的点击，并将它们传递给隐藏的选择菜单，然后选择相应的选项，以便表单提交继承用户的决定。

<select name="real-list">
  <option value="1">Option 4</option>
  <option value="2" selected="selected">Option 5</option>
  <option value="3">Option 6</option>
</select>

我能接近的最接近的东西仍然是可悲的。尽管如此，我还是会发布它。

使用背景图像的定位：

<select>
  <option></option>
  <option>Option 1</option>
  <option style="color: #000; 
        background: #ffffff 
            url(http://i49.tinypic.com/15ybyaw.jpg) 
            repeat-y 2em 0px"
  >Option 2</option>
  <option>Option 3</option>
</select>

它仅在 FF3.5 中呈现，而不在 IE、Chrome 等上呈现。要准确获得高亮位置是另一件棘手的事情。使用固定宽度的字体可能效果更好。

这是FF截图：

这对于 HTML 和 CSS 是不可能的 .. 也不是简单的Javascript .. 无论您使用什么（我的意思是动态/静态内容）最终 .. 您必须在 span 或 div 元素中编写样式 .. 这里的限制是样式必须对列表进行，Option并且不允许Span或DIV作为子元素..

另一种方法是（如Jonathan建议的那样）使用完全不同的 javascript 事件 .. 它的行为类似于<Select>但不是 select ..

但在所有方面，它都需要比平常更多的努力（设计师和浏览器的负担），因为它不是下拉列表的基本要求..

我不相信这可以单独使用 CSS 来完成。您必须使用 JavaScript。