Comment rendre l'arrière-plan transparent et le texte opaque en CSS ?-tutoriel CSS-php.cn

Comment rendre l'arrière-plan transparent et le texte opaque en CSS ?

醉折花枝作酒筹

Libérer： 2023-01-05 16:10:11

original

12389 Les gens l'ont consulté

En CSS, vous pouvez utiliser la fonction rgba pour obtenir un arrière-plan transparent et un texte opaque. Il vous suffit de définir "rgba (valeur, valeur, valeur, valeur)" pour l'arrière-plan de l'élément ; la valeur est 0 Entre ~1, cela représente la transparence. Une valeur de 0 représente complètement transparent et une valeur de 1 représente complètement opaque.

Comment rendre l'arrière-plan transparent et le texte opaque en CSS ?

L'environnement d'exploitation de ce tutoriel : système Windows 7, version CSS3&&HTML5, ordinateur Dell G3.

Utilisez rgba en css3 :

r : rouge, prenez un entier ou un pourcentage positif ;
g : vert, prenez un entier ou un pourcentage positif
b : bleu, prenez ; un Entier ou un pourcentage positif ;
a:alpha, prends un nombre compris entre 0 et 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>

Copier après la connexion

Comment rendre larrière-plan transparent et le texte opaque en CSS ?