Le contenu de cet article concerne le code d'implémentation du dégradé linéaire en CSS3. Il a une certaine valeur de référence. Les amis dans le besoin peuvent s'y référer.
css3 Le dégradé est divisé en dégradé linéaire (linéaire) et dégradé radial (radial). Étant donné que différents moteurs de rendu ont une syntaxe différente pour implémenter les dégradés, nous analysons ici uniquement son utilisation sur la base de la syntaxe standard du W3C des dégradés linéaires. Vous pouvez vous référer aux informations pertinentes pour le reste. La syntaxe a été prise en charge par les navigateurs tels que IE10+, Firefox19.0+, Chrome26.0+ et Opera12.1+.
Syntaxe du dégradé linéaire :
linear-gradient(to bottom,#FFF,#999)
Paramètres : Le premier paramètre précise la direction du dégradé, qui peut être exprimée en angle ou en anglais : 
Non. Les deuxième et troisième paramètres représentent le point de départ et le point final de la couleur. Il peut y avoir plusieurs valeurs de couleur
background-image:linear-gradient(to left, red, orange,yellow,green,blue,indigo,violet);
Exemple de code :
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>Gradient</title>
<style type="text/css">
p {
width: 400px;
height: 150px;
line-height: 150px;
text-align:center;
color: #000;
font-size:24px;
background-image:linear-gradient(to top left,yellow,blue);
}
</style>
</head>
<body> <p>右下角向左上角的线性渐变背景</p>
</body>
</html>L'effet est. comme suit :
Recommandations associées :
[CSS3]-Color RGBA et gradient_html/css_WEB-ITnose
Combat pratique du dégradé linéaire de couleur en CSS3_html/css_WEB-ITnose
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!
Tendances des prix des Eth aujourd'hui
Quelle est l'adresse du site Internet de Ouyi ?
Comment utiliser la fonction d'impression en python
Comment importer des données dans Access
Plateforme nationale d'achat et de vente de Bitcoin
Comment résoudre le problème selon lequel le partage réseau d'ordinateurs portables n'a pas d'autorisations ?
Quel est le nom de l'application de télécommunications ?
Que fait Xiaohongshu ?
![[Web front-end] Démarrage rapide de Node.js](https://img.php.cn/upload/course/000/000/067/662b5d34ba7c0227.png)
