1. 要件の説明 Divタグの右上隅に削除アイコンを表示します 2. 実装 html、CSS 3. 参照コード <スタイル> 。容器{ 幅:60ピクセル; 高さ:60px; 境界線: 1px の赤い点線; 位置:相対; } 。コンテンツ{ 位置:相対; 上:20px; } 。消去{ 幅:20px; 高さ:20px; 境界線の半径:60%; 位置:絶対; 上:-10px; 右:-10px; } </スタイル> <div class="コンテナ"> <img src="http://www.iconpng.com/download/png/61252" class="delete" onclick="alert(1)"/> <div class="content">コンテンツ</div> </div> <div class="コンテナ"> <img src="http://www.iconpng.com/download/png/61252" class="delete"/> <div class="content">コンテンツ</div> </div> 付録: 入力ボックスの左側に小さなアイコンを追加するには、CSS スタイルをどのように記述すればよいですか? <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <ヘッド> <meta http-equiv="コンテンツタイプ" コンテンツ="text/html; charset=utf-8" /> <title>無題のドキュメント</title> <スタイル> .text{border:solid 2px #ccc;width:400px;height:40px;background:url(http://d.lanrentuku.com/down/png/1211/blueberry/user_friend.png) no-repeat 0 center;} .text input{float:left;border:none;background:none;height:40px;line-height:30px;width:100%; text-indent:32px;} </スタイル> </head> <本文> <div class="text"> <入力タイプ="テキスト"/> </div> </本文> </html> 要約する html+cssを使用して右上隅に削除アイコンがあるdivタグを作成する方法についての記事はこれで終わりです。右上隅のdiv削除アイコンの詳細については、123WORDPRESS.COMの以前の記事を検索するか、次の関連記事を引き続き参照してください。今後とも123WORDPRESS.COMをよろしくお願いいたします。 |
<<: シンプルで簡単なJavaScript開発のためのSvelte実装原理の詳細な説明
>>: HTML ファイルにフラッシュ ビデオ形式 (flv、swf) ファイルを埋め込む方法
SSH 公開鍵認証は、SSH 認証方式の 1 つです。 SSH パスワードフリーのログインは公開鍵認...
Baiduのインタビューで遭遇する質問は、次のレイアウト効果を達成する必要がある。 中央の紫色の列...
サーバーマッチングロジックNginx は、リクエストを実行するサーバー ブロックを決定するときに、サ...
目次背景解決新しい質問高度な背景シャトル ボックスが大量のデータを処理すると、レンダリングされる D...
目次依存関係をインストールする構成使用1.アイコン検索ページに入る2. 使用したいアイコンの英語名を...
目次1. オペレーター要約する1. オペレーター演算子は、代入、比較、算術演算などの機能を実装するた...
インデックス条件プッシュダウン (ICP) は MySQL 5.6 で導入され、クエリを最適化するた...
CSS を使用してすべての子要素を再帰的に選択するにはどうすればよいですか?以下の記事では、CSS ...
目次導入使用シナリオソースコード分析要約する導入Vue は、コンポーネントをステートレスかつインスタ...
MySQL 5.5 のインストールと設定方法のグラフィックチュートリアルMySQL 5.5 のインス...
ドキュメント: https://github.com/hilongjw/vue-lazyload 1...
エラーメッセージ:エラー 2002: ソケット '/tmp/mysql.sock' ...
この記事では、オブジェクト パラメータをインスタンス化して MySQL でデータをクエリする方法を紹...
動的な列を実現するための Angularjs ループ オブジェクト プロパティ利点: オブジェクトを...
1. はじめにこの記事には MySQL インストール部分のスクリーンショットがないので、ある程度の基...