Moi sur mon site (http://pagesperso-orange.fr/axoul/) j'ai mis:
- Code: Tout sélectionner
<BODY BGCOLOR=darkorange>
Axoul
Question de fond
10 messages • Page 1 sur 1
Question de fond
de axoul le 23 Juil 2009, 21:40
Bonjour, j'aimerai savoir si c'est possible de faire un dégradé dans la balise "<body>" de la couleur "#F68300" à la couleur "#00A4F6" (le dégradé de gauche à droite).
Moi sur mon site (http://pagesperso-orange.fr/axoul/) j'ai mis:
Axoul
Moi sur mon site (http://pagesperso-orange.fr/axoul/) j'ai mis:
Axoul
Dernière édition par axoul le 24 Juil 2009, 11:07, édité 1 fois.
-
axoul - Nouveau Plug'zien
- Messages: 10
- Inscription: 23 Jan 2009, 17:10
- Localisation: Ã chatillon-en-michaille sur mon ordi.
- Points: 31
Re: Question de fond
de jeromecold le 24 Juil 2009, 08:18
Sur Windows, y'a une fonction de Microsoft qui permet de le faire mais sa marche que sur Windows.
Le mieux, c'est de faire un dégradé en image (jpg par exemple) et le définir cette image en fond de page!
Le mieux, c'est de faire un dégradé en image (jpg par exemple) et le définir cette image en fond de page!
Arobase plus
Re: Question de fond
de axoul le 24 Juil 2009, 11:09
jeromecold a écrit:Sur Windows, y'a une fonction de Microsoft qui permet de le faire mais sa marche que sur Windows.
Le mieux, c'est de faire un dégradé en image (jpg par exemple) et le définir cette image en fond de page!
Merci, mais pour la dimension (en px) stp.
Axoul
-
axoul - Nouveau Plug'zien
- Messages: 10
- Inscription: 23 Jan 2009, 17:10
- Localisation: Ã chatillon-en-michaille sur mon ordi.
- Points: 31
Re: Question de fond
de jeromecold le 24 Juil 2009, 16:19
Tu fais une image du type 2x5000 (pour un dégradé trèèèèèès long et vertical)
Puis à l'aide de CSS, tu le répète uniquement en x (horizontal) et au cas où, tu définis la couleur de fond de page comme étant la même que la couleur de fin du dégradé (comme ça, rien n'aura l'air d'avoir sauté et ce sera bien ;) )!
Puis à l'aide de CSS, tu le répète uniquement en x (horizontal) et au cas où, tu définis la couleur de fond de page comme étant la même que la couleur de fin du dégradé (comme ça, rien n'aura l'air d'avoir sauté et ce sera bien ;) )!
Arobase plus
Re: Question de fond
de axoul le 26 Juil 2009, 20:42
OK mais le problème c'est que je connais qu'un langage :
Je suis débutant ça fait à peine un mois que je commence...
Axoul
.HTML
Je suis débutant ça fait à peine un mois que je commence...
Axoul
-
axoul - Nouveau Plug'zien
- Messages: 10
- Inscription: 23 Jan 2009, 17:10
- Localisation: Ã chatillon-en-michaille sur mon ordi.
- Points: 31
Re: Question de fond
de jeromecold le 27 Juil 2009, 10:02
Regarde; voici un dégradé (ouhhh qu'il est beau ^^):
Pour l'utiliser en fond, normalement, tu n'as qu'à mettre, sur ta balise <body> un attribut style="background:url("super_beau_degrade.jpg");" et il sera répété (tu as donc un fond en dégradé).
Mais si jamais un utilisateur a une résolution d'écran trop élevée ou que tu fais une page trop grande, le dégradé va se répéter verticalement et faire un raccord pas beau donc on lui qit qu'il ne doit se répéter QUE horizontalement:
style="background:url("super_beau_degrade.jpg") repeat-x;" et qu'après ça, si il faut encore de l'espace sur la page, on met une couleur (la couleur de fin du dégradé comme ça on voit pas qu'il est fini) donc sa donne:
Et voilà une page avec un dégradé!
- super_beau_degrade.jpg (1.07 Ko) Vu 1310 fois
Pour l'utiliser en fond, normalement, tu n'as qu'à mettre, sur ta balise <body> un attribut style="background:url("super_beau_degrade.jpg");" et il sera répété (tu as donc un fond en dégradé).
Mais si jamais un utilisateur a une résolution d'écran trop élevée ou que tu fais une page trop grande, le dégradé va se répéter verticalement et faire un raccord pas beau donc on lui qit qu'il ne doit se répéter QUE horizontalement:
style="background:url("super_beau_degrade.jpg") repeat-x;" et qu'après ça, si il faut encore de l'espace sur la page, on met une couleur (la couleur de fin du dégradé comme ça on voit pas qu'il est fini) donc sa donne:
- Code: Tout sélectionner
<body style="background:url("super_beau_degrade.jpg") repeat-x #c7fe30;">
Et voilà une page avec un dégradé!
Arobase plus
-
axoul - Nouveau Plug'zien
- Messages: 10
- Inscription: 23 Jan 2009, 17:10
- Localisation: Ã chatillon-en-michaille sur mon ordi.
- Points: 31
Re: Question de fond
de zardoz le 27 Juil 2009, 21:54
Avec l'attribut « background-attachment:fixed » tu ne seras pas obliger
de faire un background trop en hauteur.
Celui-ci restera fixe et ce sont les éléments textes et images qui seront scrollable
Style CSS et zone HTML
Si donc tu ajoute des éléments en hauteur, suffisamment pour voir apparaitre le scrollBar verticale,
tu pourras donc scroller les éléments de la page et ton fond restera fixer en place. Il ne sera pas scrollable.
Seuls les éléments visuels « textes, images, vidéos ect... », placer entre <body> et </body> seront scrollable.
Tu pourras le faire ainsi si tu le désire
++
de faire un background trop en hauteur.
Celui-ci restera fixe et ce sont les éléments textes et images qui seront scrollable
Style CSS et zone HTML
- Code: Tout sélectionner
<!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>Index.html</title>
// -
// -- Ton style CSS
// -
<style type='text/css'>
body.chargeur { background:url('images/monBackground.jpg') repeat-x background-attachment:fixed; }
</style>
// -
// -- Fin style CSS
// .
</head>
// -
// -- Tu appelle ta classe CSS sous body
// -
<body class='chargeur'>
// -
// -- Les éléments textes et images de ta page ici.
// -
</body>
</html>
Si donc tu ajoute des éléments en hauteur, suffisamment pour voir apparaitre le scrollBar verticale,
tu pourras donc scroller les éléments de la page et ton fond restera fixer en place. Il ne sera pas scrollable.
Seuls les éléments visuels « textes, images, vidéos ect... », placer entre <body> et </body> seront scrollable.
Tu pourras le faire ainsi si tu le désire
- Code: Tout sélectionner
<body style='background:url(images/monBackground.jpg) repeat-x background-attachment:fixed;'>
// -
// -- Les éléments visuels de ta page « textes, images, vidéos et +
// -
</body>
++
Re: Question de fond
de jeromecold le 28 Juil 2009, 08:28
Petit détail Zardoz:
Background est une méga-propriété, sa sert à rien de mettre background-attachement si tu as mit "background" ^^:
background:url('images/monBackground.jpg') repeat-x fixed;
Suffit!
Et sinon, c'est une bonne méthode mais elle fonctionne moyen avec une trèèèès grande résolution, faut quand même mettre la couleur de fond!
Background est une méga-propriété, sa sert à rien de mettre background-attachement si tu as mit "background" ^^:
background:url('images/monBackground.jpg') repeat-x fixed;
Suffit!
Et sinon, c'est une bonne méthode mais elle fonctionne moyen avec une trèèèès grande résolution, faut quand même mettre la couleur de fond!
Arobase plus
Re: Question de fond
de zardoz le 28 Juil 2009, 15:53
Oui en effet entièrement d'accord pour fixed.
C'est ce que l'on fait régulièrement.
{ border: thin solid red; } » comme étant un autre exemple.
Comme tu as fait avec » repeat-x.
C'est vrai que j'ai ignorer ce point.
Je répare ici même.
Pour ce qui est de la résolution, çà vraiment je l'ignore je ne me suis pas posé la question.
++
C'est ce que l'on fait régulièrement.
{ border: thin solid red; } » comme étant un autre exemple.
Comme tu as fait avec » repeat-x.
C'est vrai que j'ai ignorer ce point.
Je répare ici même.
- Code: Tout sélectionner
<!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>Index.html</title>
// -
// -- Ton style CSS
// -
<style type='text/css'>
body.chargeur { background:url('images/monBackground.jpg') repeat-x fixed; }
</style>
// -
// -- Fin style CSS
// .
</head>
// -
// -- Tu appelle ta classe CSS sous body
// -
<body class='chargeur'>
// -
// -- Les éléments textes et images de ta page ici.
// -
</body>
</html>
- Code: Tout sélectionner
<body style='background:url(images/monBackground.jpg) repeat-x fixed;'>
// -
// -- Les éléments visuels de ta page « textes, images, vidéos et +
// -
</body>
Pour ce qui est de la résolution, çà vraiment je l'ignore je ne me suis pas posé la question.
++
10 messages • Page 1 sur 1
Qui est en ligne
Utilisateurs parcourant ce forum: Aucun utilisateur enregistré et 0 invités
- Index du forum
- L'équipe du forum • Supprimer les cookies du forum • Heures au format UTC + 1 heure
Powered by phpBB © 2000, 2002, 2005, 2007 phpBB Group
phpBB-fr.com & phpBB.biz
Design & administration by Cclleemm
Design & administration by Cclleemm