Codes courants pour ajouter des images d'arrière-plan à Xiaonei.com CSS code_Experience Exchange

Numéro de série Remarques sur la syntaxe de la marque de description chinoise
1 Couleur d'arrière-plan {background-color: valeur numérique}
2 Image d'arrière-plan {background-image: url(URL)|none}
3 Répétition d'arrière-plan {background-repeat : hériter| no-repeat|repeat|repeat-x|repeat-y}
4 Arrière-plan corrigé {background-attachment:fixed|scroll}
5 Positionnement de l'arrière-plan {background-position:numeric|top|bottom|left| droite| centre}
6 Style de dos {arrière-plan : couleur d'arrière-plan|image d'arrière-plan|répétition d'arrière-plan|pièce jointe d'arrière-plan|position d'arrière-plan}

1. Couleur d'arrière-plan : background-color

Syntaxe : {background-color: value}
Explication : La valeur du paramètre est la même que l'attribut color
Remarque : En HTML, un arrière-plan doit être ajouté à un objet Il n'y a qu'une seule façon de changer la couleur, c'est de créer d'abord un tableau, de définir la couleur d'arrière-plan du tableau, puis de placer l'objet dans la cellule. C'est plus gênant. Non seulement cela nécessite beaucoup de code, mais cela pose également quelques problèmes avec la taille et le positionnement de la table. Maintenant, il est facile de le faire directement avec CSS, et la gamme d'objets est très large, il peut s'agir d'un morceau de texte, ou simplement d'un mot ou d'une lettre.
Exemple : Ajouter une couleur d'arrière-plan à du texteAjouter une couleur d'arrière-plan à du texte
Couleur du dos du tableau : style="background-color:red"

2. Image d'arrière-plan : background-image

Syntaxe : {background-image: url(URL)|none}
Explication : L'URL est le chemin de stockage de l'image d'arrière-plan. Si « aucun » est utilisé à la place du chemin de stockage de l’image d’arrière-plan, rien ne sera affiché.
Exemple : Ajoutez une image d'arrière-plan à une partie du texte .imgbgstyle { background-image: url(logo.gif)}
3. Répétition d'arrière-plan : background-repeat

Syntaxe : {background-repeat:inherit|no-repeat|repeat|repeat-x|repeat-y}
Fonction : La répétition de l'image d'arrière-plan contrôle le carrelage de l'image d'arrière-plan Ou pas, c'est-à-dire que, combinée au contrôle du positionnement de l'arrière-plan, une image d'arrière-plan peut être affichée séparément quelque part sur la page Web
Description : Plage de valeurs du paramètre :
·hériter de l'héritage
·pas de répétition, pas de répétition Tile image d'arrière-plan
·répéter
·répéter-x rend l'image en mosaïque uniquement dans le sens horizontal
·repeat-y rend l'image en mosaïque uniquement dans la direction verticale
Remarque : si vous ne spécifiez pas de background Pour l'attribut de répétition d'image, la valeur par défaut du navigateur est que l'image d'arrière-plan soit en mosaïque dans les directions horizontale et verticale.
4． Arrière-plan corrigé : background-attachment

Syntaxe : {background-attachment:fixed|scroll}
Description : Plage de valeurs du paramètre
·fixed : Lorsque la page Web défile, l'image d'arrière-plan est relative à la fenêtre du navigateur De manière générale, fixe
·scroll : lorsque la page Web défile, l'image d'arrière-plan défile ensemble par rapport à la fenêtre du navigateur
Remarque : l'image d'arrière-plan est fixe pour contrôler si l'image d'arrière-plan défile avec le défilement de la page Web. Si vous ne définissez pas l'attribut fixe de l'image d'arrière-plan, l'image d'arrière-plan par défaut du navigateur défilera avec le défilement de la page Web. Afin d'éviter que des images d'arrière-plan trop sophistiquées n'endommagent la vue du spectateur lors du défilement, vous pouvez dissocier l'image d'arrière-plan et le contenu du texte, qui doivent être regroupés avec la fenêtre du navigateur.
Exemple : CSS qui empêche le motif d'arrière-plan de "rouler" avec le texte
BODY { background: purple url(bg.jpg); background-repeat:repeat-y; background-attachment:fixed }
5. Positionnement de l'arrière-plan : background-position

Syntaxe : {background-position: value|top|bottom|left|right|center}
Fonction : Le positionnement de l'arrière-plan est utilisé pour contrôler la position de l'image d'arrière-plan affichée sur la page Web.
Description : Plage de valeurs du paramètre
·Paramètre numérique avec unité de longueur
·haut : par rapport au haut de l'objet au premier plan
·bas : par rapport au bas de l'objet au premier plan
·gauche : par rapport à l'objet de premier plan Alignement à gauche
·droite : alignement à droite par rapport à l'objet de premier plan
·centre : alignement au centre par rapport à l'objet de premier plan
·Relation proportionnelle
Les mots-clés sont expliqués comme suit :
en haut à gauche = en haut à gauche = 0% 0 %
en haut = en haut au centre = au centre en haut = 50% 0%
en haut à droite = en haut à droite = 100% 0%
à gauche = à gauche au centre = au centre gauche = 0% 50%
centre = centre centre = 50% 50%
droite = droite centre = centre droit = ​​100% 50%
en bas à gauche = gauche en bas = 0% 100%
en bas = en bas au centre = au centre en bas = 50% 100%
en bas à droite = en bas à droite = 100% 100%
Remarque : Si le centre du paramètre est utilisé devant un autre paramètre, cela signifie un centrage horizontal s'il s'agit d'un centrage horizontal ; est utilisé après un autre paramètre, cela signifie un centrage vertical.
6. Style d'arrière-plan : arrière-plan

Syntaxe : {arrière-plan : couleur d'arrière-plan | image d'arrière-plan | répétition d'arrière-plan | pièce jointe d'arrière-plan | position d'arrière-plan}
Fonction : l'attribut d'arrière-plan est un arrière-plan plus clair – Raccourci pour les attributs de relation. Voici quelques déclarations d'arrière-plan :
Exemple :
BODY { background: white url(http://www.htmlhelp.com/foo.gif) }
BLOCKQUOTE { background: #7fffd4 }
P { background: url(../backgrounds/pawn.png) #f0f8ff corrigé }
TABLE { background: #0c0 url(leaves.jpg) no-repeat en bas à droite }
Remarque : Lorsqu'une valeur n'est pas Quand spécifiée, sa valeur initiale sera acceptée. Par exemple, dans les trois premières règles ci-dessus, la propriété de position d'arrière-plan serait définie sur 0 % 0 %. Pour éviter les conflits avec la feuille de style de l'utilisateur, l'arrière-plan et la couleur doivent être spécifiés ensemble.