0

我正在设计一个下拉组合框来显示产品的价格列表。为此，我在 css 中嵌入了卢比字体。

这是代码：

<select class="comboboxstyle" name="sports" id="sports">
  <option class="optionstyle" value="subscribe">Subscribe</option>
  <option class="optionstyle" value="monthly">Monthly <span style="font-family:Rupee">`</span>30</option>
  <option class="optionstyle" value="weekly" >Weekly<span style="font-family:Rupee">`</span>20</option>
  <option class="optionstyle" value="daily">Daily<span style="font-family:Rupee">`</span>10</option>
</select>

但是，浏览器不支持选项标签中的字体标签，而如果它不在选项标签中，它就可以正常工作。我不能在整个事情中应用卢比字体，因为只有卢比符号显示而其他文本消失。

任何帮助...

4

2 回答 2

1

您不能在内部使用 HTML 标记<option>，您的解决方法是使用<option>自身的样式，如下例所示：

<select>
    <option style="font-weight: bold;">Text Text 1</option>
    <option style="font-family: Rupee;">Text Text 2</option>
    <option style="color: #FF0000;">Text Text 3</option>
</select>
于 2012-09-20T07:20:21.190 回答
0

使用正确编码（Unicode 编码）的字体，或找到卢比符号的替代品（名称、缩写、国际货币代码、另一个公认的符号，或任何适合上下文和受众的符号）。

我想您的意思是印度卢比符号 (U+20B9)，而不是较旧的、更广泛支持的通用卢比符号。新符号已在几种正确编码的字体中实现，请参阅 http://www.fileformat.info/info/unicode/char/20b9/fontsupport.htm 但请注意，该信息适用于相当新的字体版本 - 例如，现代 Arial 包含它，但旧版本的 Arial（在定义符号之前创建）显然不会。

但是您可以考虑使用合适的免费字体，例如 DejaVu Sans，作为可下载字体，通过@font-face. 这意味着您的select菜单的字体与页面的其余部分不同，但这应该不是什么大问题。人们已经习惯了这样的事情，即使在默认情况下，许多浏览器也会在那里使用一种特殊的字体。

设置整个元素的字体失败的原因是使用的卢比字体是周围的 8 位字体之一，试图以一种快速而肮脏的方式实现一些新的（或其他特殊的）符号。这个技巧是基于一个古老的想法（现在大部分被放弃了，除了在这样的情况下）通过改变字体来改变角色的身份。也就是说，通过使用“b”字形代替“a”的字体将“a”转换为“b”。这些技巧通常以一种或另一种方式回击。

于 2012-09-20T07:58:51.453 回答