[Div+CSSチュートリアル】divの背景を透明にする設定例
2022-01-12 22:36:09
divの背景を透過させる方法には、一般的に2つの方法があります。
1. opacity 属性で設定します。値は 0~1 で、0 は透明、1 は不透明になりますが、この方法は同時に div 上のコンテンツも透明にします。
その効果は以下の通りです。
2. 背景色をrgba形式で設定します。background-color:rgba(0,0,0,0~1)の形式で、0は透明、1は不透明になります。
画像
コードは以下の通りです。 :
C:\>c:\Python27\python.exe -V
ここでもう一つ、注意すべきことがあります。
{マーク
{{/マーク
rgba()関数は、Red®、Green(G)、Blue(B)、Transparency(A)を重ね合わせ、様々な色を作り出す関数です。
{{/マーク
RGBAすなわちRed, Green, Blue, Transparency(英語ではRed, Green, Blue, Alpha)です。
赤(R) 0~255の整数で、色の赤成分を表します。
Green (G) 0から255までの整数で、色の緑成分を表します。
Blue (B) 青色成分を表す0〜255の整数。
Transparency (A) 透明度を表す0〜1の整数です。
Baiduでrgbaの値を見つけることができます。
に似ている。
画像
カラーコード比較表へのリンクです。
https://www.sioe.cn/yingyong/yanse-rgb-16
divの背景を透明に設定する方法の例では、この記事に導入され、より関連するdivの背景を透明に設定する内容は、スクリプトの家の前の記事を検索してくださいまたは次の関連記事を閲覧を続け、私はあなたが将来的にもっとスクリプトの家をサポートして願っています!.
関連
-
[CSSチュートリアル]CSSで簡単!高周波な異形ボタンを実現する方法
-
[CSSチュートリアル】Chromeのタブバーを実装するためのCSSのコツ
-
[CSSチュートリアル】CSS3Animationで実現する簡単な指のクリックアニメーションの例
-
[CSS3] CSS3リスト無限スクロール/回転効果
-
[CSSチュートリアル】波動効果を生み出すCSSのアイデア
-
[CSSチュートリアル】CSSでemを開く正しい方法 詳細へ
-
[ブラウザ互換性チュートリアル]IE9でのネイティブページの互換性問題の解決方法について
-
[CSSチュートリアル]テーブル table :nth-child()を使って行間の色変更と整列を実現する。
-
[CSSチュートリアル]マウスをスライドさせてカードを浮かせるCSSの例
-
[CSSチュートリアル] Pure CSS to click to expand もっと読む
最新
-
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 実装 サイバーパンク風ボタン
おすすめ
-
[CSSチュートリアル】QQtabBarからCSS命名規則BEMの詳細を見る
-
[CSSチュートリアル】CSS3で3つの効果例の背景をぼかす。
-
[css3]css3によるフレックスレイアウト幅の解決方法が有効でない件
-
[CSSチュートリアル]ドラッグ&ドロップ効果を実現するピュアCSSコード
-
[CSSチュートリアル】CSS複合セレクタの具体的な使用方法
-
[CSSチュートリアル]実装ステップの吸引上部と下部のH5レイアウトのための純粋なCSSソリューション
-
[CSSチュートリアル】CSSで粘着効果をつけてみる方法
-
[CSSチュートリアル】ピュアCSS3による水平無限スクロールのサンプルコード
-
[CSSチュートリアル】CSS擬似クラス:empty makes my eyes shine(コード例)
-
css3]アニメーションとトランジションの違いについて