HTML选择选项分隔符

如何在选择标签中创建分隔符?

New Window
New Tab
-----------
Save Page
------------
Exit

当前回答

如果只支持webkit，可以使用<hr>来创建真正的分隔符。

http://code.google.com/p/chromium/issues/detail?id=99534

其他回答

你可以用em破折号" - "。每个字符之间没有可见的空格。(某些字体!) 在HTML中:

<option value="—————————————" disabled>—————————————</option>

或者在XHTML中:

<option value="—————————————" disabled="disabled">—————————————</option>

禁用选项方法看起来是最好的，也得到了最好的支持。我还包含了一个使用optgroup的示例。

Optgroup(这种方式有点糟糕):

选择< > < optgroup > <选项第一< - >选项> < / optgroup > < optgroup标签 ="_________"> <选项第二< - >选项> <第三选项> < /选项> < / optgroup > 选择< - >

禁用选项(更好一点):

<选择> <选项>第一次> < /选项 <选项禁用 >_________</ 选项> <选项>第二> < /选项 <选项>第三> < /选项 < /选择>

如果你想要更花哨，可以使用水平unicode方框绘图字符。 (最佳选择!)

选择< > <选项第一< - >选项> <选项残疾人>──────────< /选项> <选项第二< - >选项> <第三选项> < /选项> 选择< - >

http://jsfiddle.net/JFDgH/2/

Try:

<optgroup label="----------"></optgroup>

 <option  data-divider="true" disabled>______________</option>

你也可以做这个。这是很容易的，使分割线选择下拉列表。

我把@Laurence Gonsalves的评论变成了一个答案，因为它是唯一一个在语义上起作用的，看起来不像一个黑客。

试着把这个添加到你的样式表中:

optgroup + optgroup { border-top: 1px solid black }

比一堆破折号好看多了。

推荐文章