我使用 jquery mobile 生成按钮,下面有一个 CSS 代码来更改其设计,但无论我在宽度和高度中输入什么值,按钮的大小都不会改变,但它相对依赖于字体大小标签。如何更改此设置,以便无论标签的字体大小如何都可以更改按钮大小?
$("#ui-1").css({'position':'absolute','left':'27.0px','top':'51.0px','width':'120.0px','height':'30.0px',});
$("#ui-1 .ui-btn-text").css({'font-family':'"Calibri","Arial","Sans Serif"','font-size':'0.75em','color':'black','text-align':'left','wordwrap':'normal','text-shadow':'1px 1px 1px #FFFFFF'});
实例:
-
http://jsfiddle.net/3EgrW/21/ (Width)
-
http://jsfiddle.net/3EgrW/35/(高度)
JS:
// For all buttons use something like this
$('.ui-btn').css('width','50%');
// For individual buttons use something like this
$('#theButton1').parent().css('width', '75%');
// Or this for HREF data-role buttons
$('#hrefButton4').css('width', '45%');
更新:(我认为这就是你正在寻找的)
// this changes the height for all buttons
$('.ui-btn-text').css('font-size','50px');
// This changes the height for a single element
$('#hrefButton3').children().children().css('font-size','30px');
HTML:
<div data-role="page" id="home">
<div data-role="content">
<input type="button" id="theButton1" value="Press Me 1" />
<input type="button" id="theButton2" value="Press Me 2" />
<input type="button" id="theButton3" value="Press Me 3" />
<input type="button" id="theButton4" value="Press Me 4" />
<br />
<a href="#" data-role="button" id="hrefButton1">HREF Me 1</a>
<a href="#" data-role="button" id="hrefButton2">HREF Me 2</a>
<a href="#" data-role="button" id="hrefButton3">HREF Me 3</a>
<a href="#" data-role="button" id="hrefButton4">HREF Me 4</a>
</div>
</div>
本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)