Comment ajouter un arrière-plan à un site Web?
Un arrière-plan de couleur unie est le type d'arrière-plan le plus basique que vous puissiez mettre sur un site Web.
L'arrière-plan est l'un des éléments les plus cruciaux d'un site Web. Un bon arrière-plan crée le ton du site Web et complète le contenu. Il existe de nombreuses façons différentes d'ajouter un arrière-plan, chacune avec un objectif différent. Certaines méthodes vous permettent d'appliquer l'arrière-plan à toutes les pages d'un site Web, tandis que d'autres limitent l'arrière-plan à une seule page. Cet article vous apprend comment ajouter un arrière-plan à votre site Web en utilisant HTML ou CSS.
Méthode 1 sur 2: méthodes html
Fond de couleur unie
- 1Un arrière-plan de couleur unie est le type d'arrière-plan le plus basique que vous puissiez mettre sur un site Web. En fait, chaque site Web commence par un fond blanc par défaut. Cependant, alors qu'un arrière-plan blanc peut être très élégant et propre lorsqu'il est utilisé avec un jeu de couleurs harmonieux, un arrière-plan de couleur différente peut être privilégié avec différents thèmes.
- 2Ouvrez votre code Web (source).
- 3Dans la balise body, ajoutez un attribut appelé bgcolor. Maintenant, votre balise corporelle devrait ressembler à
<body bgcolor="COLORNAME">ceci - où COLORNAME est le nom de la couleur. COLORNAME peut être rempli de nombreux types de représentants de couleur-<body bgcolor="red">(nom de la couleur)<body bgcolor="#FF0000">(valeur hexadécimale)<body bgcolor="rgb(255, 8, 9)">(valeur RVB)
- 4Expérimenter avec RVB et # peut conduire à de nombreuses nuances, mais vous pouvez commencer par la facilité. Mais rappelez-vous qu'en tapant une couleur peu commune comme " Ultramarine Blueish Green ", vous obtiendrez du blanc.
Ajout d'une image de fond
- L'ajout d'une image d'arrière-plan est légèrement plus compliqué qu'un arrière-plan de couleur unie.
- 1Ajoutez la propriété background à la balise body, de sorte que cela ressemble à ceci -
<body background="src">
où SRC est la source de l'image, SRC peut se trouver dans le même dossier ou dans un autre dossier/page Web.<body background="red.gif">(dans le même dossier)<body background="\Folder1\red.gif">(dans un autre dossier)<body background="imagepage1/red.gif">(dans une autre page Web)
- 2N'oubliez pas de saisir l'extension.gif/.jpeg /.bmp.
Pour ajouter un arrière-plan de couleur unie en CSS, ajoutez un attribut de style.
Méthode 2 sur 2: méthodes CSS
Fond de couleur unie
- 1Pour ajouter un arrière-plan de couleur unie en CSS, ajoutez un attribut de style. Vous pouvez également donner des identifiants et des classes et utiliser à la fois des feuilles de style externes et internes.
- 2Votre balise corporelle devrait ressembler à ceci-
<body style="background-color: COLORNAME;">
où COLORNAME est le nom de la couleur, la valeur hexadécimale ou RVB (Rappelez-vous également les dernières étapes de l'arrière-plan de couleur unie en HTML, elles sont également applicables ici).
Ajout d'une image
- 1Pour ajouter une image, ajoutez l'attribut style à la balise body. Vous pouvez également donner des identifiants et des classes et utiliser à la fois des feuilles de style externes et internes.
- 2Votre balise corporelle devrait maintenant ressembler à ceci-
<body style=" ">
- 3N'oubliez pas que SRC est la source. Il peut provenir du même dossier, d'un dossier différent ou d'une page Web différente.
<body>(dans le même dossier)<body>(dans un autre dossier)<body>(dans une autre page Web).
- 4N'oubliez pas d'ajouter les.extensions aussi.
Lisez aussi: Comment héberger des sites Internet?
Répétition de fond à motifs
- 1Pour créer un arrière-plan à motif répété, ajoutez un arrière-plan comme indiqué dans les étapes ci-dessus. Votre étiquette de corps doit maintenant être changée en-
<body style=" background-repeat:REPEAT-SETTINGS; ">Où REPEAT-SETTINGS sont les paramètres. Il peut y avoir de nombreux paramètres de répétition, comme-<body style=" background-repeat: repeat;">(L'arrière-plan se répétera à la fois verticalement et horizontalement.)<body style=" background-repeat: repeat-x;">(L'arrière-plan se répétera horizontalement.)<body style=" background-repeat: repeat-y;">(L'arrière-plan se répétera verticalement.)
Pour créer un arrière-plan à motif répété, ajoutez un arrière-plan comme indiqué dans les étapes ci-dessus.
Arrière-plan de l'image fixe
- 1Les arrière-plans d'images fixes ont l'air cool et ne changent pas lorsque vous faites défiler vers le bas. Pour les faire, il vous suffit d'apporter quelques modifications simples au code dans la section ci-dessus. Faites les ajustements pour que l'étiquette du corps ressemble à ceci-
<body style=" background-attachment:fixed; background-position:POSITION; background-repeat:REPEAT SETTINGS;">
où SRC est la source de l'image d'arrière - plan, POSITION est la position de l'image (elle peut aller du centre au haut à droite); l'attachement à l'arrière-plan est le principal «catalyseur» de ce type d'arrière-plan. Il est utilisé pour indiquer la position de l'arrière-plan et il est recommandé de ne pas le modifier.
- Lisez l'intégralité de l'article: la section laissée de côté peut contenir des conseils importants (car les sections de cet article se réfèrent les unes aux autres et sont écrites en supposant que les sections sont toutes lues).
- Les deux méthodes HTML sont dépréciées et peuvent ne pas fonctionner en HTML 4,01 Strict ainsi qu'en XHTML strict.
Questions et réponses
- Comment ajouter une image au HTML?Faites un clic gauche sur l'arrière-plan, cliquez sur «Ajouter une image?» et cliquez sur Oui, choisissez une image dans la sélection affichée ou téléchargez la vôtre.
