Maison > Article > interface Web > Comment rendre les images plus lumineuses en HTML
Comment rendre les images plus lumineuses en HTML
- 青灯夜游original
- 2021-06-08 15:31:564685parcourir
En HTML, vous pouvez utiliser l'attribut filter pour rendre l'image plus lumineuse. Il vous suffit d'ajouter le style "filter:brightness(% value)" à l'élément image. L'attribut filter définit la fonction luminosité() pour ajuster la luminosité de l'image. Lorsque la valeur de cette fonction dépasse "100%", l'image sera plus lumineuse.
L'environnement d'exploitation de ce tutoriel : système Windows 7, version CSS3&&HTML5, ordinateur Dell G3.
En HTML, vous pouvez éclaircir les images grâce à l'attribut filtre. Utilisons un exemple pour comprendre la méthode de mise en œuvre :
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<style>
.img1 {
-webkit-filter: brightness(50%);
/* Chrome, Safari, Opera */
filter: brightness(50%);
}
.img2 {
-webkit-filter: brightness(120%);
/* Chrome, Safari, Opera */
filter: brightness(120%);
}
</style>
</head>
<body>
<p>原图:</p>
<img src="img/1.jpg" alt="Pineapple" width="300">
<p>filter属性控制图片的亮度:</p>
<img class="img1" src="img/1.jpg" alt="Pineapple" width="300">
<img class="img2" src="img/1.jpg" alt="Pineapple" width="300">
</body>
</html>Rendu :
Instructions :
tutoriel vidéo CSS)
Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!