Pourquoi ma propriété d'arrière-plan CSS génère-t-elle une erreur « Opérateur incorrect » ?

Comprendre le problème « Erreur : CSS : arrière-plan : / est un opérateur incorrect »

CSS fournit une propriété abrégée pratique, l'arrière-plan, pour simplifier la gestion des divers attributs d’arrière-plan. Lorsque vous utilisez cette propriété, il est important de suivre sa syntaxe correcte. Les écarts par rapport à cette syntaxe peuvent entraîner des erreurs de validation.

Cause de l'erreur

Dans le HTML fourni, la propriété background d'un élément inclut un caractère "/", qui sépare les attributs background-position et background-size. Cependant, il s'agit d'un opérateur incorrect selon la syntaxe CSS.

Syntaxe et explication correctes

La syntaxe correcte pour la propriété background impliquant à la fois background-position et background-size est :

background: url(...) 100% 0/4% no-repeat;

Voici une répartition des valeurs :

• url(...) : Définit l'image à utiliser comme arrière-plan.
• 100% 0 : Spécifie la position de l'arrière-plan, en définissant les positions horizontale et verticale de l'image.
• / : Sépare la position de l'arrière-plan de l'arrière-plan. -size.
• 4% : définit la taille de l'arrière-plan, indiquant la largeur et la hauteur de l'image d'arrière-plan par rapport à celle de l'élément. size.
• no-repeat : empêche l'image de se répéter à travers l'élément.

Notes supplémentaires

Il convient de noter que l'arrière-plan- size doit être spécifié à côté de background-position dans la propriété background abrégée. Vous pouvez cependant spécifier background-position sans background-size, comme dans l'exemple suivant :

background: url(...) 100% 0 no-repeat;

Problème connexe

Pour référence, une question similaire a été discuté ailleurs : "Problèmes avec la position d'arrière-plan dans la propriété de raccourci d'arrière-plan."

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!