Question

使用jquery mobile，ui-input-btn ....

<div class="ui-input-btn ui-btn ui-icon-alert ui-btn-icon-top">
   <div class="buttonText">Service<br/> Interruptions</div>
   <input data-enhanced="true" value="Service Interruptions" type="button" id="service_interruptions">
</div>

我想使用自定义图标。

这可以通过此控件完成吗？

如果是，请提供样品。

谢谢

Answer 1

将自定义类添加到包装div，然后使用background-image伪选择器覆盖该类的background-size和:after。

<div class="ui-input-btn ui-btn ui-custom-icon ui-btn-icon-top">
   <div class="buttonText">Service<br/>Interruptions</div>
   <input data-enhanced="true" value="Service Interruptions" type="button" id="service_interruptions">
</div>

.ui-custom-icon:after {
  background-image: url('icon.png');
  background-size: 25px 25px;
}

<强> Demo

jquery mobile ui-input-btn自定义图标

1 个答案: