1. ホーム
  2. html

[解決済み] HTML / CSS input type="button" にイメージアイコンを追加するには?

2022-08-10 05:45:01

質問

下記のCSSを使用していますが、画像がボタンの中央に配置されてしまいます。アイコンを左寄せ、右寄せにする方法はありますか? <input type="button"> を使用してアイコンを左右に配置する方法はありますか?

background: url('/common/assets/images/icons/16x16/add.png');
background-position:center;
background-repeat:no-repeat;

どのように解決するのですか?

どうしても input をどうしても使いたい場合は、これを試してみてください。

background-image: url(...);
background-repeat: no-repeat;
background-position: <left|right>;
padding-<left|right>: <width of image>px;

通常は、もう少し簡単に buttonimg の中にある。

<button type="submit"><img> Text</button>

しかし、ブラウザの実装は button の実装は一貫しておらず、また、すべてのボタンの値が button が使用されている場合、すべてのボタンの値が送信されるという事実もあります。これは、複数送信フォームにおける "どのボタンがクリックされたか" の検出を停止させます。