[解決済み] HTML CSS インビジブルボタン
2022-02-12 13:07:01
質問
ボタンのスタイルが背景に埋め込まれているため、それらをスライスして最初からすべてやりたくないので、見えないボタン(まだ機能的でクリック可能)を作ろうとしています。
そこで、ただボタンを作り、ボタンがあるべき背景の部分にそれを置き、背景のボタン画像が見えてクリックできるように不可視にしたいのです。
何か提案はありますか?ありがとうございました。
解決方法は?
を使用する場合は、以下のプロパティを使用する必要があります。
button
要素を透過させることができます。
テキストなしの透明なボタン
button {
background: transparent;
border: none !important;
font-size:0;
}
文字が見える透明なボタン
button {
background: transparent;
border: none !important;
}
を使用し、絶対
position
で要素の位置を指定します。
例
は、div の下に button 要素を配置しています。を使用します。
position
はdivに相対し
position
ボタンを div 内に配置するために絶対指定します。
以下は動作中のものです。 JSFiddle
以下は、更新された JSFiddle ボタンからのテキストのみを表示するものです。
関連
-
[解決済み] html : iframeでhtmlのコンテンツが表示されない。
-
[解決済み] bodyタグに追加された奇妙なiframe、`rufous-sandbox`について
-
[解決済み] 文字列が部分文字列で終わっているかどうかをXPathでテストする?
-
[解決済み] HTMLファイルへのリンクは可能ですか?
-
[解決済み] CSSの親セレクタはありますか?
-
[解決済み] CSSでcellpaddingとcellspacingを設定する?
-
[解決済み] CSSでテキストや画像の背景を透明にするには?
-
[解決済み] リンクのように動作するHTMLボタンを作成する方法
-
[解決済み】なぜHTMLは "chucknorris "を色と見なすのか?
-
[解決済み】HTML5入力のプレースホルダの色をCSSで変更する。
最新
-
nginxです。[emerg] 0.0.0.0:80 への bind() に失敗しました (98: アドレスは既に使用中です)
-
htmlページでギリシャ文字を使うには
-
ピュアhtml+cssでの要素読み込み効果
-
純粋なhtml + cssで五輪を実現するサンプルコード
-
ナビゲーションバー・ドロップダウンメニューのHTML+CSSサンプルコード
-
タイピング効果を実現するピュアhtml+css
-
htmlの選択ボックスのプレースホルダー作成に関する質問
-
html css3 伸縮しない 画像表示効果
-
トップナビゲーションバーメニュー作成用HTML+CSS
-
html+css 実装 サイバーパンク風ボタン
おすすめ
-
[解決済み】エラー。要求されたURL"[no URL]"は無効です。
-
[解決済み】ラジオボタンの代わりに画像を使用する
-
[解決済み】Telegramマークダウンの構文。太字 *と* イタリック?(2018年9月)
-
[解決済み】エラー。Body " の後の無効な CSS: 期待されるセレクタまたは at-rule は、4 行目の "{" でした。
-
[解決済み] div要素間の空白を削除する方法
-
[解決済み] Angular 2+のテンプレートで値を表す三項演算子
-
[解決済み] フッターの内容が重なっているのを修正するには?
-
[解決済み] Font Awesome アイコンをプレースホルダーで使用する
-
[解決済み] HTMLのバックスペース
-
[解決済み] 透明なHTMLボタンを作るには?