recherche

Maison >interface Web >Questions et réponses frontales >Comment définir des images en CSS

Comment définir des images en CSS

藏色散人
藏色散人original
2021-04-02 10:32:436301parcourir

Comment définir l'image en CSS : créez d'abord un exemple de fichier HTML ; puis créez un div dans le corps ; enfin définissez l'image via "background-image: url("1.jpg");".

Comment définir des images en CSS

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

En CSS, vous pouvez utiliser l'arrière-plan- attribut image pour définir l'image. La propriété background-image définit l'image d'arrière-plan de l'élément. 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. 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.

En fonction de la valeur de la propriété background-repeat, l'image peut être carrelée à l'infini, carrelée le long d'un axe (x ou y), ou pas carrelée du tout.

L'image d'arrière-plan initiale (image originale) est placée en fonction de la valeur de la propriété background-position.

La valeur de l'attribut background-image :

url('URL') pointe vers le chemin d'accès à l'image.

aucun Valeur par défaut. Aucune image d'arrière-plan n'est affichée.

inherit spécifie que le paramètre de la propriété background-image doit être hérité de l'élément parent.

Conseil : Veuillez définir une couleur d'arrière-plan disponible afin que la page soit belle même si l'image d'arrière-plan n'est pas disponible.

Exemple : 

<!DOCTYPE html>
<html>
<head>
<style>
div{
width:450px;
height: 300px;
background-image: url("1.jpg");
}
</style>
</head>
<body>
<div></div>
</body>
</html>

Rendu :

Comment définir des images en CSS

Apprentissage recommandé : "Tutoriel vidéo 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!

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 définir la hauteur du tableau en HTMLArticle suivant：Comment définir la hauteur du tableau en HTML

Articles Liés

Voir plus