Maison >interface Web >tutoriel CSS >Comment définir l'image d'arrière-plan en CSS

Comment définir l'image d'arrière-plan en CSS

青灯夜游original: 2021-03-22 11:39:1316815parcourir

En CSS, vous pouvez utiliser l'attribut background ou background-image pour définir l'image d'arrière-plan. Le format de syntaxe spécifique est "background-image:url('image url');" 'url de l'image') ');".

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

En CSS, vous pouvez utiliser l'attribut background ou background-image pour définir l'image d'arrière-plan.

L'attribut background-image définit l'image d'arrière-plan d'un élément. Le format de syntaxe est le suivant :

background-image:url(&#39;URL&#39;);

Et l'attribut background est un attribut raccourci permettant de définir tous les attributs d'arrière-plan dans une seule instruction. Les propriétés qui peuvent être définies sont :

background-color : Spécifiez la couleur d'arrière-plan à utiliser
background-position : Spécifiez la position de l'image d'arrière-plan
background-size : Spécifiez la taille de l'image d'arrière-plan
background-repeat : Spécifiez comment répéter l'image d'arrière-plan
background-origin : Spécifiez la zone de positionnement de l'image d'arrière-plan
background-clip : Spécifiez la zone de peinture de l'image image d'arrière-plan
background- attachment : Définit si l'image d'arrière-plan est fixe ou défile avec le reste de la page.
background-image : Spécifiez une ou plusieurs images d'arrière-plan à utiliser

[Tutoriel recommandé : Tutoriel vidéo CSS】

Exemple : Définir l'image d'arrière-plan

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8"> 
<style>
body 
{
	background-image:url(&#39;paper.gif&#39;);
	background-color:#cccccc;
	
	/*background:#cccccc url(&#39;paper.gif&#39;);*/
}
</style>
</head>

<body>
<h1>Hello World!</h1>
</body>

</html>

Rendu :

Comment définir limage darrière-plan en CSS

Pour plus de connaissances liées à la programmation, veuillez visiter : Vidéo de programmation ! !

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!

html5 css css3 position background

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

Article précédent：Comment obtenir un effet de coins arrondis en CSSArticle suivant：Comment obtenir un effet de coins arrondis en CSS

Articles Liés

Voir plus