我正在尝试创建一些依赖于How do I add a custom icon to a standard jQuery UI theme?答案的自定义jqueryui按钮，特别是Matthew / Panayiotis的答案，在这里创建一些自定义jqueryUI按钮：
http://nie-wieder.net/metronom/test.html
正如你所看到的，按钮没有显示，而且...简而言之，我不知道出了什么问题。
我创建了一个位于此处的按钮：http://nie-wieder.net/metronom/img/plus-normal.png（还有2个其他文件，加上-hover.png和plus-active.png）并且考虑到firebug没有吓坏，文件已加载，但是......如你所见，按钮不在那里:(
css文件在这里：http://nie-wieder.net/metronom/css/style.css（向下滚动，phil-plus-classes）
我没有想法，如果你能帮助我会很棒！
祝你好运， 多米尼克
答案 0 :(得分：3)
我认为在使用自定义图标和jQuery UI按钮时要理解的关键是，将添加到 ui-button。
因此，您的蓝色正方形图标显示在银色矩形上，因为您可能使用默认的jQuery UI主题，这使按钮背景呈现银灰色。
要解决您想要在此处做的事情，我想您会希望拥抱Theme Roller来帮助您。
在该页面上，更改可点击的背景颜色：默认状态，可点击：悬停状态和可点击：活动状态到与您的图像紧密匹配的颜色（是的，是的，我发现它们比纯色更漂亮，但在这里忍受我。）
颜色更改将确保添加图标的按钮使用您选择的颜色，而不是默认颜色。
从那里，您需要决定如何最好地执行自定义图标。
请记住，从我们已经看到的情况来看，如果向ui-button添加了30x30图标，默认情况下该按钮会在任一侧添加额外的填充。
如果你想深入挖掘一下，打开你的jquery-ui CSS文件（默认或自定义，任一个），然后搜索Interaction states。
此标题下有七行类，这是声明ui-state-default类的背景和其他颜色的地方。
同样在该CSS文件中，搜索button text element。
该标题下的第三行以.ui-button-icon-only开头，与此行中元素相关联的样式包括padding: .4em; 这导致按钮比预期更宽！
[旁注：在查看后面的两行中，有一些名为ui-button-icon-primary和ui-button-icon-secondary的类，所以ui-button-icon-only不是用来声明该按钮只包含一个图标，但是要声明该按钮使用的是only按钮样式，而不是声明一个按钮为primary而另一个按钮为secondary。]
希望这能让您足以创建满意的按钮，但如果您有任何疑问，请与我联系。
答案 1 :(得分：1)
不确定您正在谈论哪个按钮，但您的<button>元素中没有任何内容包含任何文字。对于背景图像，您的span样式具有宽度和高度，但spans是无法给定宽度或高度（或填充或边距）的内联元素。在ui-icon范围内将显示值设置为inline-block会显示图像。
