Question

在示例中 http://jsfiddle.net/yotam/n2mfy3hg/ 表格单元格中有一个带有锚定警报按钮的表格。

<span>
  <a id="aimg" href="#" data-inline="true"
    class="ui-btn ui-btn-inline ui-icon-search ui-btn-icon-notext"></a>
</span>

如何才能有这样的提醒＆＃39;图标只是插入一个表格单元格，因此，既没有锚也没有按钮避免不必要的＆lt; a＆gt; -markup和不希望的悬停效果？

Answer 1

您可以使用带有几个CSS规则的简单范围来为jQM图标正确定位

<span class="ui-icon-alert ui-btn-icon-notext inlineIcon"></span>

.inlineIcon {
    display: inline-block;
    position: relative;
    vertical-align: middle;
    margin-right: 6px;
}

如果你喜欢图标是黑暗的，背后没有灰色圆圈：

<span class="ui-alt-icon ui-icon-alert ui-btn-icon-notext inlineIconNoDisk"></span>

.inlineIconNoDisk {
    display: inline-block;
    position: relative;
    vertical-align: middle;
    margin-right: 6px;
}
.inlineIconNoDisk:after {
    background-color: transparent !important;
}

以下是您更新的 FIDDLE （显示了两个选项）

使用jQuery-Mobile，如何将图标插入表格单元格

1 个答案: