覆盖jquery-mobile应用的字体重量

问题描述

 < div id（字体大小） =contdata-role =fieldcontain> 
< label for =select-choice-1class =select>选择运送方式：< / label> 
< select style =font-weight：normalname =select-choice-1id =select-choice-1> 
< option value =standard>标准：7天< / option> 
< option value =rush> Rush：3天< / option> 
< option value =express> Express：第二天< / option> 
< option value =隔夜>隔夜< / option> 
< / select> 
< / div> 
  

我尝试了内联样式和javaScript

  $（'＃select-choice-1'）。css（font-weight，normal）; 
  

但没有成功，它仍然显示为大胆。请建议如何将其取消。

解决方案

如果您使用萤火虫检查呈现的网页或者类似的，你会发现在运行时html结构与源html差别很大，可以用jQuery-ui生成漂亮的盒子：

 < span class =ui-btn-inner ui-btn-corner-allaria-hidden =true> 
< span class =ui-btn-text>标准：7天< / span> 
< span class =ui-icon ui-icon-arrow-d ui-icon-shadow>< / span> 
< / span> 
  

您想添加一条css规则来覆盖它：

  #cont .ui-btn-text {font-weight：normal;} 
  

id引用使它仅适用于这个特定的地方;如果你想在任何地方应用正常字体重量，请将其删除。小提琴：

I am trying to make the font weight normal instead of bold which jquery mobile makes by default.

<div id="cont" data-role="fieldcontain">
    <label for="select-choice-1" class="select">Choose shipping method:</label>
    <select style="font-weight: normal" name="select-choice-1" id="select-choice-1">
        <option value="standard">Standard: 7 day</option>
        <option value="rush">Rush: 3 days</option>
        <option value="express">Express: next day</option>
        <option value="overnight">Overnight</option>
    </select>
</div>

I tried both with inline style and javaScript

$('#select-choice-1').css("font-weight", "normal");

But none worked , it still showing bold. Please suggest how to make it unbold.

http://jsfiddle.net/neilghosh/MECXW/6/

解决方案

If you inspect the rendered page with firebug or similar, you would see that at runtime html structure is quite different from source html, courtesy of jQuery-ui that generates the pretty box:

<span class="ui-btn-inner ui-btn-corner-all" aria-hidden="true">
    <span class="ui-btn-text">Standard: 7 day</span>
    <span class="ui-icon ui-icon-arrow-d ui-icon-shadow"></span>
</span>

You want to add a css rule to override it:

#cont .ui-btn-text{font-weight:normal;}​

The id reference is so that it only applies to this particular place; remove it if you want to apply normal font weight everywhere. Fiddle: http://jsfiddle.net/MECXW/9/

这篇关于覆盖jquery-mobile应用的字体重量的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持！