如何在 HTML 选择元素中的选项文本之前放置一个空格字符？
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/25752/
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
How do I put a space character before option text in a HTML select element?
提问by Serhat Ozgel
In a drop down list, I need to add spaces in front of the options in the list. I am trying
在下拉列表中，我需要在列表中的选项前添加空格。我在尝试
<select>
<option>  Sample</option>
</select>
for adding two spaces but it displays no spaces. How can I add spaces before option texts?
用于添加两个空格，但不显示空格。如何在选项文本前添加空格？
回答by Rob Cooper
Isn't  the entity for space?
不是 空间实体吗？
<select>
<option> option 1</option>
<option> option 2</option>
</select>
Works for me...
对我有用...
EDIT:
编辑：
Just checked this out, there maybe compatibility issues with this in older browsers, but all seems to work fine for me here. Just thought I should let you know as you may want to replace with
刚刚检查了一下，在旧浏览器中可能存在兼容性问题，但在这里对我来说似乎一切正常。只是想我应该让你知道，因为你可能想用
回答by Riyaz Hameed
Use \xA0with String. This Works Perfect while binding C# Model Data to a Dropdown...
将\xA0与字符串一起使用。这在将 C# 模型数据绑定到下拉列表时非常有效......
SectionsList.ForEach(p => { p.Text = "\xA0\xA0Section: " + p.Text; });
回答by Matt Sheppard
I think you want or  
我想你想要 或 
So a fixed version of your example could be...
所以你的例子的固定版本可能是......
<select>
<option> Sample</option>
</select>
or
或者
<select>
<option>  Sample</option>
</select>
回答by John
As Rob Cooper pointed out, there are some compatibility issues with older browsers (IE6 will display the actual letters "& nbsp;"
正如 Rob Cooper 指出的那样，旧浏览器存在一些兼容性问题（IE6 会显示实际的字母“ ”
This is how I get around it in ASP.Net (I don't have VS open so I'm not sure what characters this actually gets translated to):
这就是我在 ASP.Net 中绕过它的方式（我没有打开 VS，所以我不确定这实际上被翻译成哪些字符）：
Server.HtmlDecode(" ")
回答by dabobert
i tried multiple things but the only thing that worked for me was to use javascript. just notice that i'm using the unicode code for space rather than the html entity, as js doenst know a thing about entities
我尝试了多种方法，但唯一对我有用的是使用 javascript。请注意，我使用 unicode 代码来表示空间而不是 html 实体，因为 js 对实体一无所知
$("#project_product_parent_id option").each(function(i,option){
$option = $(option);
$option.text($option.text().replace(/─/g,'\u00A0\u00A0\u00A0'))
});
回答by Smolla
You can also press alt+space (on mac) for a non-breaking space. I use it for a Drupal module because Drupal decodes html entities.
您也可以按 alt+space（在 Mac 上）以获得不间断空格。我将它用于 Drupal 模块，因为 Drupal 解码 html 实体。
回答by Brian Warshaw
I'm nearly certain you can accomplish this with CSS padding, as well. Then you won't be married to the space characters being hard-coded into all of your <option>tags.
我几乎可以肯定，您也可以使用 CSS 填充来实现这一点。这样您就不会被硬编码到所有<option>标签中的空格字符所吸引。
回答by Ross
@Brian
@布莱恩
I'm nearly certain you can accomplish this with CSS padding, as well. Then you won't be married to the space characters being hard-coded into all of your tags.
我几乎可以肯定，您也可以使用 CSS 填充来实现这一点。这样您就不会被硬编码到所有标签中的空格字符所吸引。
Good thinking - but unfortunately it doesn't work in (everyone's favourite browser...) IE7 :-(
很好的想法 - 但不幸的是它在（每个人最喜欢的浏览器......）IE7 中不起作用 :-(
Here's some code that will work in Firefox (and I assume Op/Saf).
这是一些可以在 Firefox 中工作的代码（我假设是 Op/Saf）。
<select>
<option style="padding-left: 0px;">Blah</option>
<option style="padding-left: 5px;">Blah</option>
<option style="padding-left: 10px;">Blah</option>
<option style="padding-left: 0px;">Blah</option>
<option style="padding-left: 5px;">Blah</option>
</select>
回答by Alain Holloway
Just use char 255 (type Alt+2+5+5on your numeric keypad) with a monospace font like Courier New.
只需使用 char 255（在数字键盘上键入Alt+ 2+ 5+ 5）和等宽字体，如Courier New.
回答by user630071
Server.HtmlDecode(" ")is the only one that worked for me.
Server.HtmlDecode(" ")是唯一对我有用的。
Otherwise the chr are printed as text.
否则 chr 将打印为文本。
I tried to add the padding as a Attribute for the listitem, however it didnt affect it.
我尝试将填充添加为列表项的属性，但它没有影响它。
