div の背景を透明にする一般的な方法は 2 つあります。1. 不透明度属性を 0 ~ 1 の値に設定します。0 は透明、1 は不透明です。ただし、この方法では div 上のコンテンツも透明になります。 効果は以下のとおりです。 2. 背景色を RGBA 形式で設定します。形式は background-color:rgba(0,0,0,0~1) で、0 は透明、1 は不透明を意味します。 コードは次のとおりです。 <!DOCTYPE html> <html lang="ja"> <ヘッド> <メタ文字セット="UTF-8"> <meta name="viewport" content="width=デバイス幅、初期スケール=1.0"> <title>ドキュメント</title> <スタイル> .id{ 幅: 600ピクセル; 高さ: 300px; } .tm1{ マージン: 40 自動; テキスト配置: 中央; 行の高さ: 200px; 幅: 800ピクセル; 高さ: 200px; 背景色: 黄色; 不透明度: 0.6; } .tm2{ マージン: 40 自動; テキスト配置: 中央; 行の高さ: 200px; 幅: 800ピクセル; 高さ: 200px; 背景色: rgba(255, 255, 0, 0.5); } </スタイル> </head> <本文> <!--背景 div--> <div class="id"> <!--透明なdivメソッド1--> <div class="tm1">透明な div 方法 1、不透明度によって透明度を設定し、div 上のテキストも透明になります: opacity: 0.6;</div><br> <!--透明なdivメソッド2--> <div class="tm2">透明な div メソッド 2、RGBA で透明度を設定します。div 上のテキストは透明ではありません: background-color:rgba(255,0,0,0.5);</div> </div> </本文> </html> もう一つ注目すべき点があります: RGBA は、Red、Green、Blue、Alpha (英語: Red、Green、Blue、Alpha) の略です。 カラーコード比較表のリンク: div 背景の透明度を設定する例に関するこの記事はこれで終わりです。より関連性の高い div 背景の透明度コンテンツについては、123WORDPRESS.COM の以前の記事を検索するか、次の関連記事を引き続き参照してください。今後とも 123WORDPRESS.COM をよろしくお願いいたします。 |
<<: UniappはBaidu Voiceを使用して録音をテキストに変換する機能を実現
目次ショートポーリングロングポーリングウェブソケットコミュニケーションの原則シンプルな1対1チャット...
King of Glory をプレイしたことがある人なら、このページの効果をよくご存知でしょう。なぜ...
MySQL データベース管理ソフトウェアには、エンタープライズ エディションとコミュニティ エディシ...
復帰文字 ( Ctrl+M ) に不安を感じても心配しないでください。それらを排除する簡単な方法がい...
最近、絵文字にコメントする機能が必要なコメント機能に取り組んでいたため、 contentEditab...
実装のアイデア:まず、アラーム情報にはitemidが必要です。これは前提条件です。情報に渡されるパラ...
この記事の例では、ショッピングカート機能を実装するためのvuexの具体的なコードを参考までに共有して...
「脳が多数の領域間の関係を処理できるように、入力は論理的なグループに分割する必要があります。」 – ...
目次序文LEDトリガー探索を始めるLEDデバイス登録LEDディレクトリ類推によって理解するクラスディ...
nginx、mysql、tomcat などのサービスをインストールするときに、使用する必要があるポー...
写真といえば、まず背景画像が思い浮かびます。私たちの装飾の多くは背景画像を使用して実現されているから...
序文:この記事は、jackyzm のブログ https://www.cnblogs.com/jack...
この記事では、動的なプログレスバー効果を実現するためのVueの具体的なコードを例として紹介します。具...
1. 800*600 未満の場合、Web ページの幅が 778 以内であれば、水平スクロール バーは...
以前はMySQLをあまり使用していなかったため、MySQLの機能にあまり詳しくありませんでした。この...