jQuery UI元素太大

| 这是相关页面:http://bit.ly/m5cyjx 几乎没有任何代码或样式。看来jQuery UI元素(在这种情况下-选择菜单和按钮)太大了。默认情况下,它们应该很小,不超过此句子的最大高度。 我直接从他们的网站上获取了jQuery UI CSS,同样,我也从该项目创建者的网站上获取了jQuery选择菜单CSS。即使使用默认代码,问题也没有改变。 有什么帮助吗? 编辑同样,选择菜单的右侧没有箭头,因为默认情况下应该如此。看一下项目页面:http://www.filamentgroup.com/lab/jquery_ui_selectmenu_an_aria_accessible_plugin_for_styling_a_html_select/     
已邀请:
        这是由于以下样式(style.css,第10行):
#main {
    margin-top: 25px;
    text-align: center;
    font-size: 25px;
}
#main
中的字体非常大,并且由于jQuery UI正确继承了其他样式,因此按钮也很大。 将上面的代码段更改为以下内容,它将看起来更好(至少是按钮):
#main {
    margin-top: 25px;
    text-align: center;
    font-size: 10px;
}
    
        是的我不明白为什么这是JQuery UI中的默认设置。我认为没有人想要这么大的按钮。 这是我的解决方法。将此添加到html文件的中。
<style type=\"text/css\">
    /* make default button size sane */
    .ui-button-text {
        font-size: .6em;
    }
</style>
    
        我发现在UI页面中,他们具有以下CSS代码: 身体 {     字体大小:62.5%; } 因此他们正在大幅缩小字体大小。将其放在您的页面中可以解决问题,它对我有用。     
        控制大小的两个CSS规则是 jquery-ui.css的第424行
input.ui-button {
    padding: .4em 1em;
}
和jquery-ui.css的第59行
.ui-widget {
    font-family: Segoe UI, Arial, sans-serif;
    font-size: 1.1em;
}
调整填充和字体大小,直到看起来像您想要的样子。     
        删除ui-widget类。 我认为模式是
<div class=\"ui-widget\">
    <div class=\"ui-widget-header\">
    </div>

    <div class=\"ui-widget-content\">
    //your button could go here 
        <div class=\"ui-button\">click me</div>
    </div>
</div>
    
        我只是偶然发现了这个问题,但是尝试将DOCTYPE html添加到您的文档中
<!DOCTYPE html>
<html>
    <body>
    </body>
</html>
在打开html标记之前。     
        @Tadeck我有一个类似的问题,改变字体大小就可以了:)谢谢! 另外,在我读到这篇文章之前,我试图查看更改内部内容的字体大小是否有效,但是由于下面我描述的原因,它没有起作用。 (所以不要做我做的事!= P) 调用jquery tabs函数制作标签的脚本
$(function() {
    $(\"#tabs\").tabs();
});
标记脚本需要建立选项卡
<div id=\"content-wrapper\">
  <div id=\"tabs\">
    <ul>
      <li><a href=\"#tabs-main\">Dashboard</a></li>
      <li><a href=\"#tabs-stuff\"> Other Stuff </a></li>
    </ul>
    <div id=\"tabs-main\"> 
       <!-- where i put unformatted content, like headers and description paragraphs -->
       <div> formatted inner content here (for graphs/visual content/tables/etc) </div>
    </div>
    <div id=\"tabs-stuff\"> 
       <!-- where i put unformatted content, like headers and description paragraphs -->
       <div> formatted inner content here (for graphs/visual content/tables/etc) </div>
    </div>
 </div>
</div>
事实证明,在每个标签div内为div设置内联样式不会改变标签的大小。我必须更改从我滚动的jQuery UI主题生成的css文件中.ui-widget类的字体大小。确实不需要更改UI的样式表,因为您可以在网站上为jQuery主题滚轮设置字体大小,然后再下载自定义主题。我只是忘了这么做。我会把这归结为我最讨厌的时刻之一。 [edit]这显然不是UI按钮,但是类似的概念和问题也适用     
        我遇到了这个问题..我的微调控件非常丑陋,巨大,并且水平放置,而不是垂直堆叠... 我去看了我的主html文件(实际上是一个剃刀MVC布局文件),发现我需要包含/themes/base/jquery.ui.spinner.css 现在我的微调器看起来很棒!     
        我尝试了所有其他答案,但似乎都无法正常工作。 有些并没有改变任何东西,而有些却有不利的副作用(例如缩小一切)。 这终于成功了:
.ui-widget
{
	font-size: 75%;
}

要回复问题请先登录注册