Comment charger une image de fond

**Mikaeel29** · 23/06/2014, 21h45

Bonjour,

Je suis novice en html et j'ai réussi a faire une page d'accueil (très basique) pour un serveur de jeu mais je n'arrive pas à mettre une image en fond d’écran.

J'ai essayé plusieurs méthodes mais je dois rater une étape.

J'ai mis mon image "Opera.gif" dans un dossier nommé "images" que j'ai mis au même endroit que mon fichier "index.htm".

puis j'ai mis dans mon fichier "index.htm" la ligne suivante juste en dessous de la balise <Style>

background-image: url(images/mon_image.gif);

Je vous met le contenu de mon fichier (c'est pas terrible mais soyez indulgent c'est mon premier essai)

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
 
<!DOCTYPE html>
<html>
	<head>
		<title>The Matrix™ [Nighmare] L4D2 Hard Coop Server</title>
		<style type="text/css">
		background-image: url(images/Opera.gif);
 
		h2 {
					color: white;
		}
		h4 {
					color: #00ffff;
		}
 
		</style>
	</head>
 
	<body style="background-color:black"; text=green";><center>
		<h1><strong><font face="calisto MT">The Matrix™</font> <font color="red"; font face="chiller"; font size="6px"> [NIGHTMARE]</font>  IP 94.23.45.200:27160</h1>
 
				<p><a href="english-page.htm">English version of this page</a></p>
 
		 <img src="http://img15.hostingpics.net/pics/208022TheMatrixNightmare.jpg";width="400" height="300">
 
		<h2>Le serveur <font color="red"; font face="chiller"; font size="6px">[NIGHTMARE]</font> du groupe Steam <a href="http://steamcommunity.com/groups/thematrixasyou/" title="Visitez la page du groupe The Matrix™ [Nightmare]"> <font color="green">The Matrix™ </font></a> vous souhaite la bienvenue</h2>
 
		<h3><font color="blue"; font face="Comic Sans MS"; font size="5px">Serveur <font color="red">Hardcore</font> qui va mettre vos talents <font color="red">à rude épreuve</font></font></h3>
 
			<h4>Ce serveur est ouvert :</h4>
 
					<p><font color="green">Aux joueurs débutants qui aiment se faire massacrer</font><br />
					<font color="yellow">Aux joueurs confirmés qui veulent savoir ce qu'ils valent</font><br />
					<font color="red">Aux joueurs experts qui souhaitent du challenge (mettez le jeu en expert si vous osez)</font></p>
 
			<h4>Les règles sont les suivantes</h4>
 
				<p><font color="green">Rester poli, courtois et fair play</font><br />
					<font color="green">Rester avec son equipe</font><br />
					<font color="yellow">Aider ses amis en difficulté</font><br />
					<font color="yellow">Favoriser la coopération qui est l'essence même du jeu</font><br />
					<font color="red">Ne pas faire de Team kill ou de friendly fire</font><br />
					<font color="red">Ne pas tricher ou utiliser les bugs du jeu</font></p>
 
		<h2><font color="red">Le non respect de ces règles peut entrainer un bannissement permanent !! </font></h2>
					<h1> <font color="white">Pour toutes questions ou suggestions</font></h1>
		<h2>envoyez un mail à <a href="mailto:thematrixis@live.fr">thematrixis@live.fr</a> ou visitez le groupe Steam <a href="http://steamcommunity.com/groups/thematrixasyou/" title="Visitez la page du groupe The Matrix™ [Nightmare]"><font color="green">"The Matrix™"</font></a></h2>
 
	</center></body>
</html>

J'ai aussi essayer de passer par un hébergeur d'image pour mettre le lien directement

background-image: url(http://img15.hostingpics.net/thumbs/...6grille1.jpg);

mais rien à faire ça veut pas marcher.

Merci d'avance pour vos réponses!

**CCyrillus** · 23/06/2014, 22h56

Il te faut un sélecteur pour appliquer une regle css;
Ici ce serait apparement:

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

html {}

dans lequel tu met ta règle:

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

html {background-image: url(images/Opera.gif);}

**Mikaeel29** · 24/06/2014, 02h10

Super, ça marche !

merci beaucoup !

Je savais bien que c’était pas grand chose.

Par contre il a fallut que j'utilise {body} comme sélecteur car {html} me mettait l'image sur le contour uniquement.

En tout cas merci beaucoup.

**Muchos** · 24/06/2014, 06h36

Vous pouvez passer la discussion en RÉSOLU.

Je vous met le contenu de mon fichier (c'est pas terrible mais soyez indulgent

Si vous savez que ce n'est pas terrible, il faut cesser d'être indulgent.

**Mikaeel29** · 24/06/2014, 13h26

Envoyé par Muchos

Si vous savez que ce n'est pas terrible, il faut cesser d'être indulgent.

C'est vrai.

d'ailleurs je me tape sur les doigts souvent !

Je disais "c'est pas terrible" par rapport a des pages html que j'ai pu consulter.
Mais comme j'ai à peine 6 heures d'expérience j’essaye d’être indulgent avec moi même pour l'instant.

Par contre je vois que j'ai pas mal de boulot avant d'arriver a faire quelque chose de potable car je pense, à terme, me faire un site pour mon entreprise.

y' a du pain sur la planche ... :/

**Muchos** · 25/06/2014, 04h00

Il s'agirait juste de ne plus utiliser les balises FONT et CENTER (dépréciées), et de n'utiliser de styles que dans la balise STYLE ou dans une feuille de style.
En tout cas, bon courage et bonne continuation

Comment charger une image de fond

CSS

Vue hybride

Discussions similaires

Partager

Partager