0

我想在我自己的工具栏中使用 jquery UI 主题而不使用 jquery 本身。

我有：

<div class="toolbar ui-widget-header ui-corner-all">
  <a href="#" class="ui-icon ui-icon-circlesmall-close">close</a>
  <a href="#" class="ui-icon ui-icon-circlesmall-plus">open</a>
</div>

CSS：

.toolbar {
    height:28px;
}
    .toolbar a {
        display:inline-block;
        height:24px;
        width:24px;
    }

它可以工作，但是当我在 a hrefs 上设置填充或大小时，我没有在按钮上获得一个很好的居中图标，因为它在图标文件中显示图标和周围图标的一部分。

有可能纠正这个吗？

4

2 回答 2

2

您可以使用边距而不是填充。这将使图标保持居中。

.toolbar {
    height:28px;
}
.toolbar a {
    display:inline-block;
    height:16px;
    width:16px;
    margin:6px;
}
于 2012-07-29T13:55:16.153 回答
0

我在这里找到了答案：

http://www.filamentgroup.com/lab/styling_buttons_and_toolbars_with_the_jquery_ui_css_framework/

看起来它需要一个合适大小的单独跨度来防止图标文件显示周围的图标（精灵）。

于 2012-07-30T15:12:13.783 回答