1

jquery mobileでボタンのデフォルトの境界線を削除するには? タグをボタンとして宣言し、<a>以下のカスタム背景画像を使用します。

<a id="btnLogin" href="../main/mainx.html" data-role="button" data-corner="false"> Login</a>
<a id="btnSignUp" href="../singup/signup.html" data-role="button" data-corner="false"> Sign Up</a>

CSS:

a{
    width: 265px;
    height: 38px;
    margin-left: auto;
    margin-right: auto;
    margin-top: 5px;
    border: 0px;
    border-color: transparent;
    display: box;
    text-transform: none;
    text-shadow: none;

}
#loginPage a .ui-btn-inner{
    padding-top: 11px;
}
#loginPage #btnLogin{
    background: transparent url(../../res/img/login_btn.png) no-repeat;
    background-size: 100% 100%;
    color: #FFF;

}
#loginPage #btnLogin:hover{
    background: transparent url(../../res/img/login_btn_over.png) no-repeat;
    background-size: 100% 100%;
}

#loginPage #btnSignUp{
    background: transparent url(../../res/img/signup_btn.png) no-repeat;
    background-size: 100% 100%;
    color: grey;
}

#loginPage #btnSignUp:hover{
    background: transparent url(../../res/img/signup_btn_over.png) no-repeat;
    background-size: 100% 100%;
    color: #fff;
}

ボタンは、次のようにぼかし枠内に表示されます。ここに画像の説明を入力

私を助けてください。

4

6 に答える 6

3

jQuery Mobile のボタンのデフォルト スタイルをオーバーライドするには、クラスを変更して.ui-btnから!important、各プロパティを変更します。

デモ: http://fiddle.jshell.net/Palestinian/8TH5d/

.ui-btn { border: none !important; }

影については、この属性data-shadow="false"を<a>タグに追加します。

于 2013-04-18T08:13:48.997 に答える
3

Outline プロパティを探していると思います:

a {
    outline:0;
}
于 2013-04-18T06:44:24.740 に答える
1

ボタン要素を使用するように変更すると、すべて正常に動作します。

<button id="btnLogin" href="../main/mainx.html" data-role="none" data-corner="false"> Login</button>
<button id="btnSignUp" href="../singup/signup.html" data-role="none" data-corner="false"> Sign Up</button>`
于 2013-04-18T06:44:07.837 に答える
0

このソリューションは私にとってはうまくいきました

border: none !important;
box-shadow: none !important;
outline: 0;
于 2014-10-07T12:48:10.003 に答える