Maison >interface Web >tutoriel CSS >Utilisation de l'attribut STYLE.BACKGROUND

Utilisation de l'attribut STYLE.BACKGROUND

DDD
DDDoriginal
2023-06-27 16:27:503197parcourir

La propriété

Utilisation de l'attribut STYLE.BACKGROUND

STYLE.BACKGROUND est une propriété CSS utilisée pour styliser l'arrière-plan d'un élément. Grâce à cet attribut, nous pouvons définir des attributs tels que l'image d'arrière-plan, la couleur d'arrière-plan, la répétition d'arrière-plan et la position d'arrière-plan.

Image d'arrière-plan : vous pouvez spécifier une image comme arrière-plan de l'élément via un lien URL ou un chemin relatif. Voici un exemple :

element.style.backgroundImage = "url('image.jpg')";

Background-color : Utilisé pour définir la couleur d'arrière-plan de l'élément. Les couleurs peuvent être spécifiées à l'aide de noms de couleurs prédéfinis ou de valeurs RVB, ou la transparence peut être définie à l'aide de la fonction rgba(). Voici un exemple :

element.style.backgroundColor = "red";

Background-repeat : utilisé pour définir le mode de répétition de l'image d'arrière-plan. Peut être réglé sur répétition (valeur par défaut, l'image d'arrière-plan est affichée à plusieurs reprises), répétition-x (affichage répété dans le sens horizontal), répétition-y (affichage répété dans le sens vertical) et non-répétition (pas d'affichage répété). Voici un exemple :

element.style.backgroundRepeat = "no-repeat";

Background-position : utilisé pour définir la position de l'image d'arrière-plan. Vous pouvez utiliser des mots-clés (gauche, centre, droite, haut, bas, etc.) ou des valeurs de pixels spécifiques à spécifier. Voici un exemple :

element.style.backgroundPosition = "center";

Background-attachment : utilisé pour définir si l'image d'arrière-plan bouge avec le défilement. Il peut être réglé pour défiler (valeur par défaut, l'image de fond se déplacera au fur et à mesure que la barre de défilement défile) ou fixe (l'image de fond est fixe sur la page et ne bouge pas avec le défilement). Voici un exemple :

element.style.backgroundAttachment = "fixed";

Ce qui précède ne sont que quelques exemples d'utilisation de l'attribut STYLE.BACKGROUND. Il existe d'autres attributs tels que background-size, background-clip, background-image, etc. Explorez et utilisez davantage. Dans l’ensemble, la propriété STYLE.BACKGROUND est une propriété CSS très flexible et puissante qui peut aider avec les effets.

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!

Déclaration:
Le contenu de cet article est volontairement contribué par les internautes et les droits d'auteur appartiennent à l'auteur original. Ce site n'assume aucune responsabilité légale correspondante. Si vous trouvez un contenu suspecté de plagiat ou de contrefaçon, veuillez contacter admin@php.cn