0

検索ボタンで、Firefox でのみ表示され、他のブラウザー (Chrome、IE、Opera を確認) では表示されない背景画像を作成しました。

これは私のHTMLです（Joomlaによって生成されました）：

<input class="button" type="image" onclick="this.form.searchword.focus();" src="/dev/" value="Search">

そして、ここに私のCSSがあります:

#search .search .button{
    background: #1B3F8B url('../images/search_btn.png') no-repeat center center;
    border:1px solid #1B3F8B;
    width:22px;
    height:32px;
    float:right;
}

私の画像はRGB .pngです

奇妙なことに、Google Chrome に読み込まれているのに、0.5 秒後に消えて、通常の「画像が読み込まれていません」という画像が表示されます。

この問題に対する答えが見つからないようです。この問題の経験がある人、または私が間違っていることを知っている人はいますか?

4

2 に答える 2

2

type="image"に変更する必要がありますtype="button"。背景画像は css クラスにあるためsrc、HTML マークアップからも削除できます。

マークアップは次のようになります。

<input class="button" type="button" onclick="this.form.searchword.focus();" value="Search">

コンマを追加するには、CSS を更新する必要もあります。

#search, .search, .button{
于 2013-11-01T19:54:46.750 に答える
1

CSS でセレクターを区切るコンマが必要です。まだ削除する必要があるsrc="/dev/"と思います。

#search, .search, .button {
    background : url('../images/search_btn.png') center center no-repeat #1B3F8B;
    border : #1B3F8B solid 1px;
    width : 22px;
    height : 32px;
    float : right;
}

http://jsfiddle.net/M5BaR/1/

于 2013-11-01T20:22:32.913 に答える