mais en vertical (en tapant top au lieu de left)background: -moz-linear-gradient(left, red, orange, yellow, green, blue);
Code : Tout sélectionner
body {
background: background: -moz-linear-gradient(top, red, orange, yellow, green, blue);
width: 100%;
float: left;
}
Code : Tout sélectionner
<?xml version="1.0" encoding="utf-8"?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="fr">
<head>
<meta http-equiv="Content-Type" content="application/xhtml+xml; charset=utf-8"/>
<title>Arc-en-ciel</title>
<style type="text/css">
body {
background: grey;
/*background-repeat: no-repeat;*/
width: 100%;
/*height: 750px;*/
float: left;
}
div {
width: 45%;
height: 250px;
clear: both;
/*float: left;*/
margin: 10px;
border: 1px solid black;
padding: 5px;
}
h1, h2 { text-align: center; }
.top { background: -moz-linear-gradient(top, red, orange, yellow, green, blue); }
.right { background: -moz-linear-gradient(right, red, orange, yellow, green, blue); }
.bottom { background: -moz-linear-gradient(bottom, red, orange, yellow, green, blue); }
.left { background: -moz-linear-gradient(left, red, orange, yellow, green, blue); }
</style>
</head>
<body class="top">
<h1>Création d'un fond arc-en-ciel</h1>
<div class="top">
<h2>De haut en bas…</h2>
<p>Ça marche pour le <em>body</em> en spécifiant <em>width: 100%;</em> et <em>float: left;</em>.</p>
</div>
<div class="right">
<h2>De droite à gauche…</h2>
</div>
<div class="bottom">
<h2>De bas en haut…</h2>
</div>
<div class="left">
<h2>De gauche à droite…</h2>
</div>
</body>
</html>
Code : Tout sélectionner
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html lang="fr">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
<title>Arc-en-ciel</title>
<style type="text/css">
html {
height: 100%;
background-repeat:no-repeat;
background-image: -moz-linear-gradient(top, red, orange, yellow, green, blue);
}
</style>
</head>
<body>
<h1>Page avec un fond arc-en-ciel</h1>
<p>blabla</p>
</body>
</html>De toutes façons c'est un "-moz-" donc pas universel du tout.FF_Olivier a écrit :Mais je ne suis pas sûr que ce soit une solution « universelle »…
Code : Tout sélectionner
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="fr" >
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-utf8" />
<title>De Tout et de Rien mais pas grand chose de Bien ?</title>
<style type="text/css">
body{background: -moz-linear-gradient(top, red, orange, yellow, green, blue); background-attachment: fixed;}
#mapage{ position: absolute; width: 1000px; height: 1345px; top: 15px; left: 50%; margin-left: -502px; border: 8px solid #e3bf3d; background: #3c007e;
font-family: rockwell, georgia, verdana, arial, "MS sans serif";}
</style>
</head>
<body class="soleil">
<div id="mapage">
</div>
</body>
</html>
NON !jeanmarever a écrit :Code : Tout sélectionner
#mapage{ position: absolute; width: 1000px; height: 1345px; […]
80 ce n'est pas le plus grand nombre. Il reste 20% pour lesquels ça ne va pas : veux-tu vraiment te passer de 20% de tes visiteurs ?jeanmarever a écrit :je pouvais satisfaire le plus grand nombre (80 %) des moniteurs.
Bien sûr que si !jeanmarever a écrit :On ne peut satisfaire tout le monde ??
Charset iso-utf8, ça n'existe pas, c'est utf-8 tout court et avec un tiretjeanmarever a écrit :Code : Tout sélectionner
<meta http-equiv="Content-Type" content="text/html; charset=iso-utf8" />
.Utilisateurs parcourant ce forum : Parfaite et 2 invités