ホームページ ウェブフロントエンド jsチュートリアル jsを使用してボタンに背景画像を追加する一般的な方法のまとめ

jsを使用してボタンに背景画像を追加する一般的な方法のまとめ

Jul 07, 2017 pm 02:56 PM
javascript ボタン 背景画像

この記事では、主に js で背景画像を追加するボタンを実装するための一般的な方法を紹介し、jsイベントトリガー コントロールの背景画像、CSS スタイル コントロール、および画像ボタンの 3 つのメソッドをリストします。

この記事の例では、js でボタンに背景画像を追加する一般的な方法について説明します。皆さんの参考に共有してください。具体的な実装方法は次のとおりです:

方法 1:

コードは次のとおりです:

<input type="submit" onMouseOver="style=background:url(&#39;imgs/jb51.gif&#39;)"/>
ログイン後にコピー

方法 2:

コードは次のとおりです:

<input type="button" value="提交" style="background:url(图片地址) no-repeat;border:none;text-indent:-2000px;width:100px;height:30px;">
ログイン後にコピー

方法 3:
画像ボタンを使用するだけです。つまり:

コードは次のとおりです:

<input name="submit" type="image" value=" " src="jb51.jpg" />
ログイン後にコピー


以上がjsを使用してボタンに背景画像を追加する一般的な方法のまとめの詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。

このウェブサイトの声明
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。

ホットAIツール

Undresser.AI Undress

Undresser.AI Undress

リアルなヌード写真を作成する AI 搭載アプリ

AI Clothes Remover

AI Clothes Remover

写真から衣服を削除するオンライン AI ツール。

Undress AI Tool

Undress AI Tool

脱衣画像を無料で

Clothoff.io

Clothoff.io

AI衣類リムーバー

AI Hentai Generator

AI Hentai Generator

AIヘンタイを無料で生成します。

ホットツール

メモ帳++7.3.1

メモ帳++7.3.1

使いやすく無料のコードエディター

SublimeText3 中国語版

SublimeText3 中国語版

中国語版、とても使いやすい

ゼンドスタジオ 13.0.1

ゼンドスタジオ 13.0.1

強力な PHP 統合開発環境

ドリームウィーバー CS6

ドリームウィーバー CS6

ビジュアル Web 開発ツール

SublimeText3 Mac版

SublimeText3 Mac版

神レベルのコード編集ソフト(SublimeText3)

Win10の個人設定で背景画像を削除する方法 Win10の個人設定で背景画像を削除する方法 Dec 21, 2023 pm 02:31 PM

Win10システムで使用されているデスクトップの背景が、設定の個人用背景画像に表示されるたびに、それを削除したいが、削除方法がわからないユーザーがいます。この記事は、Win10システムで個人用背景画像を削除する方法について説明します。このサイトで共有されているWin10。使用されているデスクトップの背景画像を表示: 1. デスクトップの空白スペースで [右クリック] をクリックし、表示されるメニュー項目で [個人用設定] を選択します; 2. 背景の選択画像で、デスクトップの背景を表示できます使用した画像; 使用したデスクトップの背景画像を削除: 注: この操作にはレジストリの変更が含まれます。レジストリの変更には危険が伴います。事前にデータをバックアップしてください。 1. [Win+R] キーの組み合わせを同時に押します。実行ウィンドウを開いて [regedit] ] コマンドを入力し、[OK] をクリックします。 2

WebSocket と JavaScript を使用してオンライン音声認識システムを実装する方法 WebSocket と JavaScript を使用してオンライン音声認識システムを実装する方法 Dec 17, 2023 pm 02:54 PM

WebSocket と JavaScript を使用してオンライン音声認識システムを実装する方法 はじめに: 技術の継続的な発展により、音声認識技術は人工知能の分野の重要な部分になりました。 WebSocket と JavaScript をベースとしたオンライン音声認識システムは、低遅延、リアルタイム、クロスプラットフォームという特徴があり、広く使用されるソリューションとなっています。この記事では、WebSocket と JavaScript を使用してオンライン音声認識システムを実装する方法を紹介します。

電源ボタンを押してもラップトップが起動しないのはなぜですか? 電源ボタンを押してもラップトップが起動しないのはなぜですか? Mar 10, 2024 am 09:31 AM

Windows ラップトップが起動しない理由はいくつか考えられます。メモリ障害、バッテリー切れ、電源ボタンの故障、またはハードウェアの問題はすべて一般的な原因です。この問題の解決に役立つ解決策をいくつか紹介します。電源ボタンを押してもラップトップの電源が入らない 電源ボタンを押しても Windows ラップトップの電源がオンにならない場合は、問題を解決するために次の手順を実行してください。 ラップトップは完全に充電されていますか?ハード リセットを実行してラップトップをクリーニングします。 メモリを取り付け直します。 透明 CMOS タイプのバッテリーを取り付けます。 ラップトップを修理に持っていきます。 1] ラップトップは完全に充電されていますか?最初に行うことは、ラップトップが完全に充電されているかどうかを確認することです。バッテリーが消耗するとノートパソコンが起動しなくなる

WebSocket と JavaScript: リアルタイム監視システムを実装するための主要テクノロジー WebSocket と JavaScript: リアルタイム監視システムを実装するための主要テクノロジー Dec 17, 2023 pm 05:30 PM

WebSocketとJavaScript:リアルタイム監視システムを実現するためのキーテクノロジー はじめに: インターネット技術の急速な発展に伴い、リアルタイム監視システムは様々な分野で広く利用されています。リアルタイム監視を実現するための重要なテクノロジーの 1 つは、WebSocket と JavaScript の組み合わせです。この記事では、リアルタイム監視システムにおける WebSocket と JavaScript のアプリケーションを紹介し、コード例を示し、その実装原理を詳しく説明します。 1.WebSocketテクノロジー

iPhone 16はどんな感じですか? iPhone 16ではどのような変更点があるのでしょうか? iPhone 16はどんな感じですか? iPhone 16ではどのような変更点があるのでしょうか? Apr 07, 2024 pm 05:10 PM

iPhone 15 シリーズのリリース後、Apple の新しい iPhone 16 の外観と構成に関する暴露が絶えずありました。 iPhone 16はどんな感じですか? iPhone 16では何か改善はありますか?最近、海外ブロガーがiPhone 16シリーズのデザインを披露していましたが、全体的なデザインは基本的にiPhone 15シリーズと同じです。写真からもわかるように、iPhone 16シリーズ全体に新たに「撮影」ボタンが標準装備され、より便利に写真を撮影できるようになりました。さらに、その他のデザインの詳細はまだ不明です。メッセージは、この新しいボタンがビデオの撮影に使用され、電源ボタンの下にあることを示しています。以前のニュースでは、それが容量性ソリッドステートボタンである可能性があると述べられていましたが、最近のレポートでは、依然としてボタンである必要があることが示されています。

JavaScript と WebSocket を使用してリアルタイムのオンライン注文システムを実装する方法 JavaScript と WebSocket を使用してリアルタイムのオンライン注文システムを実装する方法 Dec 17, 2023 pm 12:09 PM

JavaScript と WebSocket を使用してリアルタイム オンライン注文システムを実装する方法の紹介: インターネットの普及とテクノロジーの進歩に伴い、ますます多くのレストランがオンライン注文サービスを提供し始めています。リアルタイムのオンライン注文システムを実装するには、JavaScript と WebSocket テクノロジを使用できます。 WebSocket は、TCP プロトコルをベースとした全二重通信プロトコルで、クライアントとサーバー間のリアルタイム双方向通信を実現します。リアルタイムオンラインオーダーシステムにおいて、ユーザーが料理を選択して注文するとき

Douyin Live Companion に背景画像を追加する方法 - Douyin Live Companion に背景画像を追加する方法 Douyin Live Companion に背景画像を追加する方法 - Douyin Live Companion に背景画像を追加する方法 Mar 05, 2024 am 09:16 AM

Douyin でライブ配信を行う多くのユーザーは Douyin Live Companion ソフトウェアを使用しますが、Douyin Live Companion に背景画像を追加する方法をご存知ですか? 以下は、Douyin Live Companion が提供する背景画像を追加する方法です。ご興味のあるユーザー様は、ぜひ下記をご覧ください。まずコンピュータでDouyin Live Companionにログインし、ホームページに入ります。左側の[シーン1]の[マテリアルの追加]を選択します。次に、ページ上に素材を追加するウィンドウが表示されるので、[写真]機能を直接選択してクリックして入力します。次に、画像素材がローカルに保存されているウィンドウを開きます。追加したい写真素材を選択し、右下隅にある開くボタンをクリックして追加する必要があります。画像を追加した後、マウスの左ボタンを使用して画像を適切な場所にドラッグする必要があります。

IEブラウザでボタンが反応しない問題を解決する方法 IEブラウザでボタンが反応しない問題を解決する方法 Jan 30, 2024 am 10:48 AM

IEブラウザがWebボタンをクリックしても応答がない場合はどうすればよいですか? Web ボタンをクリックしても反応がない場合は、互換ビューで設定できます。友人が IE ブラウザを使用しているときに、Web ページ上のボタンをクリックしてもブラウザが応答しなくなり、Web ページの機能が使用できなくなりました。どのように設定すればよいでしょうか?以下に IE ブラウザをまとめました。Web ボタンをクリックしたときにブラウザが応答しない問題を解決するにはどうすればよいですか? そうでない場合は、フォローして読み続けてください。 IE ブラウザで Web ボタンをクリックしても反応しない 解決方法: 1. 図に示すように、IE ブラウザを開き、操作バーの [ツール] ボタンをクリックし、[互換表示] 設定をクリックします。 2. [互換表示]設定ページで、右側の[追加]ボタンをクリックし、Webサイトを入力します。

See all articles