Maison > interface Web > tutoriel CSS > Quels sont les attributs liés à l'arrière-plan en CSS ? Introduction aux propriétés d'arrière-plan CSS

Quels sont les attributs liés à l'arrière-plan en CSS ? Introduction aux propriétés d'arrière-plan CSS

不言
Libérer: 2018-08-18 13:45:05
original
5458 Les gens l'ont consulté

Quels sont les attributs associés à l'arrière-plan CSS ? L'article suivant vous présentera les propriétés d'arrière-plan CSS. Il a une certaine valeur de référence. Les amis dans le besoin peuvent s'y référer.

1. L'attribut CSS background définit la couleur d'arrière-plan du contenu : background-color
attribut :
Couleur;
hériter ; hériter du style parent

box.html

<!doctype html>
<html>
<head>
    <mate charset="utf-8">
    <title>背景</title>
    <link href="box.css" type="text/css" rel="stylesheet">
    </head>
    <body>
    <p为内容设置背景色:background-color;</p>
    </body>
    </html>
Copier après la connexion

box.css

body{    
background-color:#123456;
}
Copier après la connexion

2. content. Image background-image: url();
box.css

body{
    background-color:#123456;    
    background-image:url(image.png);
    }
Copier après la connexion

3. Correction de l'image d'arrière-plan background-attachment
(dans Utiliser le attribut background-attachment en CSS pour corriger l'image sur le navigateur. Si vous faites glisser la barre de défilement, l'image d'arrière-plan ne défilera pas avec le défilement du contenu de la page Web, comme le texte flottant sur l'image)
Valeur de l'attribut :
scroll; L'image d'arrière-plan défile avec le contenu, valeur par défaut
fixe; L'image d'arrière-plan est fixe et ne défile pas avec le contenu
hérite du style de la classe parent

box.css

body{
    background-color:#123456;    
    background-image:url(image.png);    
    background-attachment:fixed;    
    font-size: 45px;
    }
Copier après la connexion

4. Attribut d'arrière-plan CSS, image d'arrière-plan, répétition d'arrière-plan ;
Valeur de l'attribut :
Répéter ; image d'arrière-plan de la mosaïque ; par défaut
Non-répéter ; ne pas mosaïquer les images ;
Répéter-x ; Mosaïque horizontalement
repert-y; tuile dans le sens vertical

box.css

 body{
     background-color:#123456;    
     background-image:url(image.png);    
     background-attachment:fixed;    
     font-size: 45px;    
     background-repeat: repeat-y;    
}
Copier après la connexion

5. Positionnement de l'image d'arrière-plan background-position
attribut de l'attribut d'arrière-plan CSS Valeur :
haut; haut
centre; milieu
bas; bas
droite
gauche
hériter du style de classe parent
xxxpx,xxxpx; xxx%,xxx%;
xxxpx,top;

box.css

Recommandations associées :
body{
    background-color:#123456;    
    background-image:url(image.png);    
    background-attachment:fixed;    
    font-size: 45px;    
    background-repeat:no-repeat;    
    background-position:left;
    }
Copier après la connexion

Arrière-plan CSS que vous ne connaissez pas – explication complète des attributs d'arrière-plan CSS


Explication détaillée de l'attribut background de CSS

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:
css
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