你如何调整 jQuery 按钮的大小？
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/2724041/
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 you size the jQuery Button?
提问by Alex
I'm using the jQuery UI Button control but don't seem to be able to adjust the size (width and height). Here's the API documentation. I tried setting a STYLE attribute on it, but then the LABEL wasn't centered correctly. Thanks.
我正在使用 jQuery UI 按钮控件，但似乎无法调整大小（宽度和高度）。这是API 文档。我尝试在其上设置 STYLE 属性，但随后 LABEL 未正确居中。谢谢。
回答by Jakob Kruse
Try this in the style attribute:
在 style 属性中试试这个：
width: 300px;
padding-top: 10px;
padding-bottom: 10px;
or
或者
$(element).css({ width: '300px', 'padding-top': '10px', 'padding-bottom': '10px' });
回答by joanballester
normally:
一般：
$(theElement).css('height','...px').css('width','...px');
回答by scott
You can style the .ui-button.ui-widget(no spaces, must have both classes). (make sure your stylesheet appears below the jquery ui one). You can also style
您可以设置样式.ui-button.ui-widget（没有空格，必须有两个类）。（确保您的样式表出现在 jquery ui 下方）。你也可以风格
.ui-button.ui-widget{
height, width
}
.ui-button.ui-widget .ui-button-text{
line-height, font-size
}
回答by Xavier John
Here is my solution to make jquery UI button the same width. First I need a method to get the max width.
这是我使 jquery UI 按钮具有相同宽度的解决方案。首先我需要一种方法来获得最大宽度。
var greatestWidth = 0; // Stores the greatest width
function getMaxWidth() {
var theWidth = $(this).width(); // Grab the current width
if( theWidth > greatestWidth) { // If theWidth > the greatestWidth so far,
greatestWidth = theWidth; // set greatestWidth to theWidth
}
}
Then I call this method after hooking up the button and set the size. example
然后我在连接按钮并设置大小后调用此方法。例子
$('.selector')
.button()
.each(getMaxWidth);
$('.selector').width(greatestWidth);
回答by Savanetech
I found that putting <small></small>around the button tags helps a lot. This is only beneficial in certain cases, but it helped me to reduce the size on a project I was working on.
我发现放置<small></small>按钮标签有很大帮助。这仅在某些情况下有益，但它帮助我缩小了我正在从事的项目的规模。
回答by MJ Storm
Based off of this documentation http://api.jquery.com/height/the below worked for:
基于此文档http://api.jquery.com/height/以下适用于：
$('#mybutton').button({ icons: { primary: "ui-icon-plus" }, text: false}).height(20);
回答by Usha
You can the style the element with relative font-size. If your button has the custome class 'buttonStyle' then add this to the CSS
您可以使用相对字体大小来设置元素的样式。如果您的按钮具有客户类“buttonStyle”，则将其添加到 CSS
.buttonStyle{
font-size:0.8em;
}
