<button>対<input type = "image">

Question

これは私の同僚の一人が素敵なグラフィックをデザインした「バスケットに追加」コントロールです。明らかに、それは簡単なハイパーリンクが行うつもりはない投稿要求を生成するはずです。

Amazonは画像入力を使用してそれを実現します。しかし

<button type="submit"><img src="atb.png" alt="Add to Basket" /></button> 

（および外観を制御するためにCSSを使用して）対

<input type="image" src="atb.png" alt="Add to Basket" /> 

の長所と短所は何ですか？

が、私はそれがこれらの質問に沸く推測：

• は、グラフィカルおよび非グラフィカルすべてのブラウザを行い、画像入力はキーボードでアクセス可能にするために彼らの義務で成功？ （キーボードレスデバイスの場合は、入力手段が何であれアクセス可能にしてください）

• <button>をサポートしていないブラウザはありますか？

• それぞれには他にどのような利点と欠点がありますか？

• 独自のメリットがある他の方法はありますか（それを忘れて、単純な送信を使用する以外に）？

Answer 1

は同等である必要があります。スタイリングの目的で、将来的に物事を変更すると、ボタンタグはより柔軟になります。

しかし、 IEにはバグや機能があり、ボタンや入力の値はinnerHTMLに等しく設定されています。これは、サーバー側のコードでこれを特定の値にする必要がある場合に問題を引き起こす可能性があります。

<button>の追加のスタイリングの柔軟性が必要な場合を除き、<input type="image">に行ってください。そうすれば、IEの癖に対処する必要はありません。

Answer 2

入力タイプ= "画像"は無効の属性をサポートしており、ブラウザは画像をグレーアウトします。タイプ=ボタンでは、代替のグレー画像を入力する必要があります。