Maison > interface Web > tutoriel CSS > Comment configurer l'image d'arrière-plan pour qu'elle ne défile pas lorsque le contenu du texte défile

Comment configurer l'image d'arrière-plan pour qu'elle ne défile pas lorsque le contenu du texte défile

清浅
Libérer: 2019-01-18 15:28:49
original
10852 Les gens l'ont consulté

Nous pouvons corriger l'image grâce à la valeur fixe dans l'attribut background-attachement afin qu'elle ne défile pas lorsque le contenu du texte défile

Comment configurer l'image d'arrière-plan pour qu'elle ne défile pas lorsque le contenu du texte défile

L'attribut background-attachement est principalement défini Si l'image de fond défile avec le contenu ou reste fixe

Sa valeur d'attribut est

fixe : indique que l'image de fond reste fixe dans la fenêtre du navigateur et reste corrigé lors du défilement de l'élément ou la page ne bouge pas.

scroll : Indique que lorsque le document défile, l'image d'arrière-plan défile avec l'objet

Dans le cas suivant, utilisez "fixed" dans la pièce jointe d'arrière-plan attribut pour faire l'arrière-plan Il ne défilera pas pendant que le texte défile

	body{
		background-image: url("images/7.jpg");
		background-attachment:fixed;
		background-repeat: no-repeat;
		}
Copier après la connexion

Rendu :

Comment configurer limage darrière-plan pour quelle ne défile pas lorsque le contenu du texte défile

Changement fixé pour faire défiler, l'image d'arrière-plan défilera comme le texte défile Scroll

body{
		background-image: url("images/7.jpg");
		background-attachment:scroll;
		background-repeat: no-repeat;
		}
Copier après la connexion

rendu :

Comment configurer limage darrière-plan pour quelle ne défile pas lorsque le contenu du texte défile

Résumé : Nous pouvons donc définir l'attribut background-attachment surfixe pour rendre l'image fixé. .

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!

Étiquettes associées:
source:php.cn
Déclaration de ce site Web
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
Tutoriels populaires
Plus>
Derniers téléchargements
Plus>
effets Web
Code source du site Web
Matériel du site Web
Modèle frontal