CSSで背景を透明にし、テキストを不透明にする方法は?-CSSチュートリアル-php.cn

CSSで背景を透明にし、テキストを不透明にする方法は?

醉折花枝作酒筹

リリース： 2023-01-05 16:10:11

オリジナル

12346 人が閲覧しました

CSS では、rgba 関数を使用して、透明な背景と不透明なテキストを実現できます。要素の背景に「rgba (値、値、値、値)」を設定するだけで済みます。透明度 ( A) は値 0 をとります ~1 の間では、透明度を表します。値 0 は完全に透明を表し、値 1 は完全に不透明を表します。

CSSで背景を透明にし、テキストを不透明にする方法は?

このチュートリアルの動作環境: Windows 7 システム、CSS3&&HTML5 バージョン、Dell G3 コンピューター。

css3 で rgba を使用します:

r: 赤、正の整数またはパーセンテージを取得します;
g: 緑、正の整数またはパーセンテージを取得します;
b: 青、正の整数またはパーセンテージを取得します正の整数またはパーセンテージ;
a:alpha、0 から 1 までの数値を取得します

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>css3的rgba</title>
<style>
*{
    padding: 0;
    margin: 0;
}
body{
    padding: 50px;
}
.mydemo{
    padding: 25px;  
    background-color: red;
    background-color:rgba(255,0,0,0.5);
}
.mydemo p{
    color: black;
}
</style>
</head>
<body>    
    <div class="mydemo">
        <p>myIp</p>     
    </div>
</html>

ログイン後にコピー

CSSで背景を透明にし、テキストを不透明にする方法は?