?nsérer une image en fond d'écran en html
karol
-
duweb Messages postés 388 Statut Membre -
duweb Messages postés 388 Statut Membre -
Bonjour,
Je cherche à insérer une image en fond d'écran sur une page web.
Après recherche, j'ai trouvé ça:
<body background="image.jpeg">
Il parait que ça marche... ok, c'est bien gentil mais on le met où ?
Qui peut m'aider ?
Je cherche à insérer une image en fond d'écran sur une page web.
Après recherche, j'ai trouvé ça:
<body background="image.jpeg">
Il parait que ça marche... ok, c'est bien gentil mais on le met où ?
Qui peut m'aider ?
A voir également:
- ?nsérer une image en fond d'écran en html
- Comment mettre une vidéo en fond d'écran - Guide
- Double ecran - Guide
- Capture d'écran whatsapp - Accueil - Messagerie instantanée
- Transformer une image en icone - Guide
- Mettre une image en fond sur word sur une seule page - Guide
4 réponses
voila le code au cas ou:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Document sans nom</title>
<style type="text/css">
<!--
body {
font: 100%/1.4 Verdana, Arial, Helvetica, sans-serif;
background: #036;
margin: 0;
padding: 0;
color: #000;
}
ul, ol, dl {
padding: 0;
margin: 0;
}
h1, h2, h3, h4, h5, h6, p {
margin-top: 0;
padding-right: 0px;
padding-left: 0px;
}
a img {
border: none;
}
a:link {
color: #42413C;
text-decoration: underline;
}
a:visited {
color: #6E6C64;
text-decoration: underline;
}
a:hover, a:active, a:focus {
text-decoration: none;
color: #FFF;
}
.container {
width: 960px;
background: #036;
margin: 0 auto;
}
.header {
background: #036;
}
.content {
padding: 0px 0;
}
.footer {
padding: 0px 0;
background: #036;
}
.fltrt {
float: right;
margin-left: 8px;
}
.fltlft {
float: left;
margin-right: 8px;
}
.clearfloat {
clear:both;
height:0;
font-size: 1px;
line-height: 0px;
}
.container .content table {
color: #FFF;
text-align: center;
}
.container .content table {
font-family: Tahoma, Geneva, sans-serif;
}
.container .content table {
font-size: 10%;
}
.container .content table {
font-size: 10px;
}
.container .content table {
font-size: 12px;
font-weight: bold;
}
-->
</style></head>
<body>
<div class="container">
<div class="header"><!-- end .header --></div>
<div class="content">
<table width="954" border="0">
<tr>
<td width="136">texte1</td>
<td width="210">texte2</td>
<td width="200">texte3</td>
<td width="221">texte4</td>
<td width="153">texte5</td>
</tr>
</table>
<img src="../../image.jpg" width="960" height="550" alt="legende" />
<table width="954" border="0">
<tr>
<td width="136">Contact</td>
<td width="210">blablabla</td>
<td width="200">blablabla</td>
<td width="221">blablabla</td>
<td width="153">copyright A.T2010</td>
</tr>
</table>
</div>
<div class="footer">
<!-- end .footer --></div>
<!-- end .container --></div>
</body>
</html>
Je veux mettre l'image "img src" en fond d'écran.
Voila... je sais que je suis chieuse et nulle alors merci a tous ceux qui auront la patience de m'aider... ;-)
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Document sans nom</title>
<style type="text/css">
<!--
body {
font: 100%/1.4 Verdana, Arial, Helvetica, sans-serif;
background: #036;
margin: 0;
padding: 0;
color: #000;
}
ul, ol, dl {
padding: 0;
margin: 0;
}
h1, h2, h3, h4, h5, h6, p {
margin-top: 0;
padding-right: 0px;
padding-left: 0px;
}
a img {
border: none;
}
a:link {
color: #42413C;
text-decoration: underline;
}
a:visited {
color: #6E6C64;
text-decoration: underline;
}
a:hover, a:active, a:focus {
text-decoration: none;
color: #FFF;
}
.container {
width: 960px;
background: #036;
margin: 0 auto;
}
.header {
background: #036;
}
.content {
padding: 0px 0;
}
.footer {
padding: 0px 0;
background: #036;
}
.fltrt {
float: right;
margin-left: 8px;
}
.fltlft {
float: left;
margin-right: 8px;
}
.clearfloat {
clear:both;
height:0;
font-size: 1px;
line-height: 0px;
}
.container .content table {
color: #FFF;
text-align: center;
}
.container .content table {
font-family: Tahoma, Geneva, sans-serif;
}
.container .content table {
font-size: 10%;
}
.container .content table {
font-size: 10px;
}
.container .content table {
font-size: 12px;
font-weight: bold;
}
-->
</style></head>
<body>
<div class="container">
<div class="header"><!-- end .header --></div>
<div class="content">
<table width="954" border="0">
<tr>
<td width="136">texte1</td>
<td width="210">texte2</td>
<td width="200">texte3</td>
<td width="221">texte4</td>
<td width="153">texte5</td>
</tr>
</table>
<img src="../../image.jpg" width="960" height="550" alt="legende" />
<table width="954" border="0">
<tr>
<td width="136">Contact</td>
<td width="210">blablabla</td>
<td width="200">blablabla</td>
<td width="221">blablabla</td>
<td width="153">copyright A.T2010</td>
</tr>
</table>
</div>
<div class="footer">
<!-- end .footer --></div>
<!-- end .container --></div>
</body>
</html>
Je veux mettre l'image "img src" en fond d'écran.
Voila... je sais que je suis chieuse et nulle alors merci a tous ceux qui auront la patience de m'aider... ;-)
- l'attribut backgound est déprécié. de plus étant donné que le style du body (couleur de fond) est défini dans le css, l'image ne peut pas être visible si on utilise body background
il faut simplement modifier cette partie
par
il faut simplement modifier cette partie
body {
font: 100%/1.4 Verdana, Arial, Helvetica, sans-serif;
background: #036;
par
body {
font: 100%/1.4 Verdana, Arial, Helvetica, sans-serif;
background: #036 url(../../image.jpg) no-repeat left top;
on ne voit plus l'image ? cad
sinon pour répondre à la question correctement posée :-)
remplacer
par
et créer le style css
et évidemment supprimer l'image placée dans le style body
sinon pour répondre à la question correctement posée :-)
remplacer
<img src="../../image.jpg" width="960" height="550" alt="legende" />
par
<div class="contenu">mon texte, .......</div>
et créer le style css
.contenu{
background: transparent url(../../image.jpg) no-repeat left top;
position:fixed;
width:960px;
height:550px;
}
et évidemment supprimer l'image placée dans le style body