Maison > interface Web > tutoriel CSS > Comment obtenir un effet de répétition d'image d'arrière-plan avec CSS

Comment obtenir un effet de répétition d'image d'arrière-plan avec CSS

藏色散人
Libérer: 2021-04-22 15:54:20
original
6985 Les gens l'ont consulté

Comment obtenir l'effet de répétition de l'image d'arrière-plan avec CSS : créez d'abord un exemple de fichier HTML et entrez le code de base ; puis implémentez-le via "background-image: url(img/154e.png); background- répéter: répéter;" attribut L'image d'arrière-plan répète l'effet.

Comment obtenir un effet de répétition d'image d'arrière-plan avec CSS

L'environnement d'exploitation de cet article : système Windows 7, ordinateur Dell G3, version HTML5&&CSS3.

Effet de répétition de l'image de fond, je pense que tout le monde l'a vu sur les principaux sites Web. Un bel effet de répétition d'image d'arrière-plan peut rendre notre page Web plus belle et plus riche en contenu. Nous pouvons obtenir cet effet grâce aux propriétés liées à l'arrière-plan en CSS.

Ci-dessous, nous utiliserons un exemple de code simple pour vous présenter l'effet de la répétition des images d'arrière-plan en utilisant CSS.

L'exemple de code est le suivant :

<!DOCTYPE>
<html>
<meta charset="utf-8">
<head>
    <title></title>
    <style type="text/css">
        body{
            background-image: url(img/154e.png);
            background-repeat: repeat;
        }
    </style>

</head>
<body>
</body>
</html>
Copier après la connexion

L'image unique que nous utilisons ici est la suivante :

Comment obtenir un effet de répétition d'image d'arrière-plan avec CSS

Ensuite, l'image d'arrière-plan est répétée. L'effet final est le suivant (capture d'écran partielle) :

Comment obtenir un effet de répétition d'image d'arrière-plan avec CSS

Introduction aux attributs associés :

attribut background-imageL'image d'arrière-plan peut être définie pour les éléments. L'arrière-plan d'un élément occupe toute la taille de l'élément, y compris le remplissage et les bordures, mais pas les marges.

attribut background-repeat Définissez si et comment répéter l'image d'arrière-plan.

Remarque : Par défaut, l'image d'arrière-plan est placée dans le coin supérieur gauche de l'élément et se répète horizontalement et verticalement.

Référence recommandée : "Tutoriel CSS"

Cet article concerne l'introduction du CSS pour obtenir l'effet de répétition de l'image d'arrière-plan. J'espère également qu'il est très simple. cela sera utile aux amis qui en ont besoin.

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