Question

我有一个按钮的css和html代码，如下所示。按钮将在标题中..

 <div data-role="header" data-position="fixed">
          <a href="#home" data-role="button" data-inline="false" data-icon="my-map" data-theme="c" data-iconshadow="false">
            <img src='http://img3.wikia.nocookie.net/__cb20131126195004/epicrapbattlesofhistory/images/a/aa/Home_icon_grey.png' alt="custom buttom" />
        </a>

css代码：

.ui-icon-my-map {

    background-position: 4px 50%;
    background-size: 16px 11px;
    height: 12px;
    margin-top: -8px !important;
    width: 15px;
    background-color: transparent;
}

按钮应该显示为图像而不是按钮。以及如何将按钮的大小减小到正常的主页图标大小。

Answer 1

将代码更改为此....

 <div data-role="header" data-position="fixed">
 <a href="#home" data-role="button" data-inline="false" data-icon="my-map" data-theme="c" data-iconshadow="false">
 <img src='http://img3.wikia.nocookie.net/__cb20131126195004/epicrapbattlesofhistory/images/a/aa/Home_icon_grey.png' alt="custom buttom" style="height:32px;border:none;" />
 </a>

如果您需要/需要进一步的帮助，请回复

Answer 2

<div data-role="header" data-position="fixed"> <a href="#home" data-role="button" data-inline="false" data-icon="my-map" data-theme="c" data-iconshadow="false" class="home"><img src='http://img3.wikia.nocookie.net/__cb20131126195004/epicrapbattlesofhistory/images/a/aa/Home_icon_grey.png' alt="custom buttom"  />

.home img {
height:35px;
display:block;}

http://jsfiddle.net/Vgcuj/

如何修改按钮的样式和大小

2 个答案: