Un fond Bouton_activeUn fond Bouton_hoverUn fond Fb-hoverUn fond Fb-active
CSSActif, le forum, n'est plus maintenu. Il est néanmoins disponible pour consultation. Pour des outils pratiques, rendez-vous sur:

Découvrez CSSActif, une collection d'outils et de tutoriels interactifs pour les développeurs Web — HTML, CSS, JavaScript et bien plus!

Derniers sujets
» Système d'onglets simple et personnalisable
Un fond EmptyLun 03 Juin 2024, 17:20 par birds

» Fiche de Présentation RPG
Un fond EmptySam 30 Mar 2024, 22:07 par Peyton972

» [RPG] Fiche personnage avec bannière
Un fond EmptySam 30 Mar 2024, 22:06 par Peyton972

» Structure de Qui Est En Ligne (1)
Un fond EmptyLun 04 Mar 2024, 23:20 par Peyton972

» Qui Est En Ligne - Utopia
Un fond EmptyDim 24 Déc 2023, 18:16 par romee

» Pack forum complet "Androïd Sylver" RPU (N°2)
Un fond EmptyJeu 02 Nov 2023, 06:42 par Hydrar

» Formulaire de connexion rapide amélioré
Un fond EmptySam 04 Mar 2023, 18:57 par Krager

» Avatar centré dans le profil
Un fond EmptySam 11 Fév 2023, 06:04 par Krager

-20%
Le deal à ne pas rater :
Sony PULSE Elite – Casque PS5 sans fil (blanc) à 119€
119 € 149 €
Voir le deal

Partagez
 

Un fond

Voir le sujet précédent Voir le sujet suivant Aller en bas 
Aller à la page : 1, 2  Suivant
Mitsu
Mitsu
{ Membre }
{ Membre }

Féminin Messages : 146



Un fond Empty
Bonjour. Je voudrais savoir, j'ai mis une bannière de fond mais je voudrais savoir comment faire pour mettre un fond de page de couleur en pouvant faire défiler sans bouger l'image, je ne sais pas si je suis compréhensible.


Dernière édition par Mitsu le Mar 21 Sep 2010, 16:16, édité 1 fois
MessageSujet: Un fond   Un fond EmptyJeu 16 Sep 2010, 08:33
Revenir en haut Aller en bas
http://ginkgo-gakuen.roleaddict.com/
Ilowyn
Ilowyn
{ Membre }
{ Membre }

Féminin Messages : 36



Un fond Empty
Yop,

Je comprends pas bien où tu veux en venir. Si tu veux que le fond soit d'une couleur, il suffit de mettre la couleur dans le panneau d'administration, non ? Ou tu parles par exemple d'un fond en dégradé qui devrait rester fixe en haut de la page, même quand on défile ? (comme sur mon forum de test)
MessageSujet: Re: Un fond   Un fond EmptyJeu 16 Sep 2010, 09:34
Revenir en haut Aller en bas
http://gintama.forumactif.com/
Gintoki
{ Membre }
{ Membre }

Masculin Messages : 128



Un fond Empty
Je pense que nous voulons arriver à la même chose. Tu aimerais que ta bannière ne bouge plus et reste en haut de ta page comme ceci : http://reborn-online.forum-actif.net/forum.htm
MessageSujet: Re: Un fond   Un fond EmptyJeu 16 Sep 2010, 11:14
Revenir en haut Aller en bas
http://ginkgo-gakuen.roleaddict.com/
Ilowyn
Ilowyn
{ Membre }
{ Membre }

Féminin Messages : 36



Un fond Empty
Donc c'est à peu près ce que je disais, du moins c'est la même méthode. Il y a un tuto ici : fait par Orange ou une autre façon de faire pour un résultat semblable, mais pas tout à fait similaire.

Il faut aller dans le template overall_header. Cherchez :
Code:
<body background="{T_BODY_BACKGROUND}" bgcolor="{T_BODY_BGCOLOR}" text="{T_BODY_TEXT}" link="{T_BODY_LINK}" vlink="{T_BODY_VLINK}">

Et mettez, juste en-dessous un :
Code:
<div class="banniere">

Changez bien sûr le nom de la classe par ce que vous voulez. Pour superposer plusieurs fonds, ajoutez cette balise autant de fois qu'il le faudra, en modifiant le nom de la classe à chaque fois.

Ensuite, rendez-vous dans overall_footer et cherchez :
Code:
</body>

C'est pas dur, c'est tout en bas. Et juste avant cette balise, il vous faudra mettre autant de < /div> (sans l'espace) que vous en aviez mis dans overall_header.

Ensuite, à vous de gérer vos images via le CSS. Mais pensez à enlever la couleur d'intérieur du forum pour voir votre bannière, et à ajouter une bannière transparente comme logo du forum dans la gestion des images.

La seconde méthode a l'avantage de permettre de superposer autant de fonds qu'on veut : une bannière en haut du forum + une image de fond qui se répète derrière + une image sur le côté, par exemple.

[Je dis vous parce que tu sembles aussi chercher comment faire Gintoki, même s'il me semblait que tu y étais parvenu.]
MessageSujet: Re: Un fond   Un fond EmptyJeu 16 Sep 2010, 12:50
Revenir en haut Aller en bas
http://gintama.forumactif.com/
Gintoki
{ Membre }
{ Membre }

Masculin Messages : 128



Un fond Empty
Ilowyn a écrit:

Changez bien sûr le nom de la classe par ce que vous voulez. Pour superposer plusieurs fonds, ajoutez cette balise autant de fois qu'il le faudra, en modifiant le nom de la classe à chaque fois.

Est-ce que tu pourrais expliquer ça ? S'il te plait. J'ai pas tout compris = S Après ça que faut-il faire pour que le CSS influence ça? Je me suis perdu @_@
MessageSujet: Re: Un fond   Un fond EmptyJeu 16 Sep 2010, 12:59
Revenir en haut Aller en bas
http://ginkgo-gakuen.roleaddict.com/
Ilowyn
Ilowyn
{ Membre }
{ Membre }

Féminin Messages : 36



Un fond Empty
Hn, je te "montre" ça alors^^ Mettons que tu veuilles deux fonds : une bannière en haut, centrée et fixe et un dégradé qui se répète horizontalement (comme sur mon forum de test).

Dans overall_header, ça se traduit par :
Code:
<body background="{T_BODY_BACKGROUND}" bgcolor="{T_BODY_BGCOLOR}" text="{T_BODY_TEXT}" link="{T_BODY_LINK}" vlink="{T_BODY_VLINK}">
 
<div class="degrade">
<div class="banniere">
Dans overall_footer :
Code:
</div>
</div>
</body>
Deux div dans overall_header, deux dans overall_footer.

Ensuite dans le CSS, ça te donnera :
Code:
.degrade {
    background-image: url('LIEN_DU_DEGRADE');
    background-attachment: fixed;
    background-repeat: repeat-x;
}

.banniere {
    background-image: url('LIEN_DE_LA_BANNIERE');
    background-position: top;
    background-repeat: no-repeat;
}

Avec un exemple très moche : http://stocklub.forumactif.com/. C'est plus clair comme ça ? Smile
MessageSujet: Re: Un fond   Un fond EmptyJeu 16 Sep 2010, 13:14
Revenir en haut Aller en bas
http://gintama.forumactif.com/
Gintoki
{ Membre }
{ Membre }

Masculin Messages : 128



Un fond Empty
Merci pour les précisions. ^.^

Par contre ça ne marche quand même pas. = /

En fait regarde http://saphirath.forumactif.com/index.htm

Il y a toujours le motif qui suit la souris et passe sous les catégories et les forums jusqu'au QEEL.

En fait il faudrait qu'il reste fixe sous la bannière. Mais même en mettant :

Code:
    background-attachment: fixed;

ça ne marche pas.
MessageSujet: Re: Un fond   Un fond EmptyJeu 16 Sep 2010, 13:29
Revenir en haut Aller en bas
http://misslitchyproduction.yourme.net
Kimy
{ Membre actif }
{ Membre actif }

Féminin Messages : 1190



Un fond Empty
Bonsoir =)
Justement tu as fixé le fond du forum alors il ne bouge pas. C'est le forum qui bouge pas lui.
Enlève cette ligne du CSS
MessageSujet: Re: Un fond   Un fond EmptyJeu 16 Sep 2010, 13:35
Revenir en haut Aller en bas
Mitsu
Mitsu
{ Membre }
{ Membre }

Féminin Messages : 146



Un fond Empty
j'ai pas tellement compris le autant de < /div> à mettre ><
MessageSujet: Re: Un fond   Un fond EmptyJeu 16 Sep 2010, 15:23
Revenir en haut Aller en bas
http://ginkgo-gakuen.roleaddict.com/
Ilowyn
Ilowyn
{ Membre }
{ Membre }

Féminin Messages : 36



Un fond Empty
J'ai montré dans mon second message pourtant *sait plus comment expliquer XD* Qu'est-ce que tu comprends pas en fait ?

Sinon, j'avais bien compris ton problème ou pas ?
MessageSujet: Re: Un fond   Un fond EmptyJeu 16 Sep 2010, 15:29
Revenir en haut Aller en bas
Mitsu
Mitsu
{ Membre }
{ Membre }

Féminin Messages : 146



Un fond Empty
J'ai mis cela :

Code:
<div class="banniere">

Mais après j'ai pas compris ce qu'il fait faire avec le
MessageSujet: Re: Un fond   Un fond EmptyJeu 16 Sep 2010, 16:48
Revenir en haut Aller en bas
http://ginkgo-gakuen.roleaddict.com/
Ilowyn
Ilowyn
{ Membre }
{ Membre }

Féminin Messages : 36



Un fond Empty
Ok. Alors... En mettant
Code:
<div class="banniere">
Tu as ouvert une balise. Il faut la refermer (logique). Pour ça, tu vas dans le template overall_footer et tu descends tout en bas pour chercher
Code:
</body>
Et juste avant, tu refermes la balise div, ce qui te donnera :
Code:
</div></body>
MessageSujet: Re: Un fond   Un fond EmptyJeu 16 Sep 2010, 17:26
Revenir en haut Aller en bas
Mitsu
Mitsu
{ Membre }
{ Membre }

Féminin Messages : 146



Un fond Empty
Ok mais le problème c'est que mon image du fond revient lorsque j'enlève le fond fixe c'est normal on va dire mais je ne veux pas que ça bouge et j'ai bien mis une image transparente comme image principale
MessageSujet: Re: Un fond   Un fond EmptyJeu 16 Sep 2010, 17:42
Revenir en haut Aller en bas
http://ginkgo-gakuen.roleaddict.com/
Ilowyn
Ilowyn
{ Membre }
{ Membre }

Féminin Messages : 36



Un fond Empty
Hum, tu aurais l'adresse de ton forum que je vois ça stp ? Parce que là... x_X

Qu'est-ce que tu appelles ton image de fond ? Et ton image de fond fixe ?
MessageSujet: Re: Un fond   Un fond EmptyJeu 16 Sep 2010, 18:24
Revenir en haut Aller en bas
Mitsu
Mitsu
{ Membre }
{ Membre }

Féminin Messages : 146



Un fond Empty
Voici mon forum test : Effacé ^^


Dernière édition par Mitsu le Sam 18 Sep 2010, 08:49, édité 1 fois
MessageSujet: Re: Un fond   Un fond EmptyVen 17 Sep 2010, 01:45
Revenir en haut Aller en bas
http://ginkgo-gakuen.roleaddict.com/
Ilowyn
Ilowyn
{ Membre }
{ Membre }

Féminin Messages : 36



Un fond Empty
Hum... Mets ça dans ton code CSS, à la place de l'actuel :
Code:
.banniere {
background-image: url('http://img11.hostingpics.net/pics/643790theme.png');
background-position: top center;
background-repeat: no-repeat; }

Ça te le positionnera en haut, au centre et sans la répétition Very Happy
MessageSujet: Re: Un fond   Un fond EmptyVen 17 Sep 2010, 07:17
Revenir en haut Aller en bas
iowan
iowan
{ Membre actif }
{ Membre actif }

Masculin Messages : 304



Un fond Empty
salut,
test le code de Ilowyn si sa marche c'est bon sinon efface le et met ce code dans le css de ton forum

Code:

body{
    #4DB9B4 url(http://img11.hostingpics.net/pics/643790theme.png) no-repeat top scroll !important;
}
MessageSujet: Re: Un fond   Un fond EmptyVen 17 Sep 2010, 10:22
Revenir en haut Aller en bas
Mitsu
Mitsu
{ Membre }
{ Membre }

Féminin Messages : 146



Un fond Empty
Ca marche pas pour les deux codes que vous m'avez donné
MessageSujet: Re: Un fond   Un fond EmptyVen 17 Sep 2010, 16:29
Revenir en haut Aller en bas
http://gintama.forumactif.com/
Gintoki
{ Membre }
{ Membre }

Masculin Messages : 128



Un fond Empty
Merci Kimyyyyyyyyyyyy C'est parfait! ^^

Mitsu grâce à Kimy et Ilowyn ont va venir à bout de notre problème.

En ayant appliqué la méthode de Ilowyn avec le "bannière" dans le template:
Mets ça dans le CSS

Code:

.banniere {
    background-image: url('TON URL');
    background-position: top;
    background-repeat: no-repeat;
}

Je pense que là ça va marcher ^^ En tout cas, pour moi ça fonctionne. ^^

Merci beaucoup à vous deux. ^^-
MessageSujet: Re: Un fond   Un fond EmptySam 18 Sep 2010, 07:18
Revenir en haut Aller en bas
Mitsu
Mitsu
{ Membre }
{ Membre }

Féminin Messages : 146



Un fond Empty
Ben moi mon fond se répète, j'ai bien mis le CSS mais ça change rien, faut il mettre quelque chose dans le template ? Et aussi faut il que je mette le fond fixe ou pas ?
MessageSujet: Re: Un fond   Un fond EmptySam 18 Sep 2010, 08:53
Revenir en haut Aller en bas
http://ginkgo-gakuen.roleaddict.com/
Ilowyn
Ilowyn
{ Membre }
{ Membre }

Féminin Messages : 36



Un fond Empty
Je crois que je viens de comprendre *a eu une illumination soudaine*

Je t'ai donné une méthode pour mettre une bannière en "fond" sans passer par la gestion des images (méthode qui te permettait de rajouter un motif derrière la bannière), mais avant ça, tu avais mis cette bannière en fond de forum classique (dans la gestion des images), non ?

Donc tu as deux choix :
1/ Tu ne veux pas simplement garder une couleur derrière cette bannière, mais ajouter un motif (comme Gintoki voulait faire), auquel cas dans Gestion des images, tu supprimes très simplement ta bannière en face de "Image du fond de page :" ;
2/ Ou bien tu veux tout simplement la couleur bleue derrière ta bannière, sans rien d'autre. Auquel cas c'est pas la peine de se compliquer l'existence avec mon micro tuto. Tu supprimes les modifications faites dans les templates overall_header et overall_footer. Ensuite, tu supprimes le CSS
Code:
.banniere {
background-image: url('http://img11.hostingpics.net/pics/643790theme.png');
background-position: top center;
background-repeat: no-repeat; }

Et à la place, tu mets ça :
Code:
body {background-position: top center; background-repeat: no-repeat;}


____
Sinon, pour répondre à ta question...
Code:
background-attachement: fixed;
Ce code-là permet à l'image de rester parfaitement immobile lorsque tu scrolles. En d'autres termes, ton forum passera par-dessus, mais on la verra en fond puisqu'elle ne bougera absolument jamais. Cependant, ça ne l'empêchera pas de se répéter jusqu'à couvrir ta page en longueur et en largeur.

Code:
background-repeat: no-repeat;
Cette partie-là gère les répétitions d'image. En mettant "no-repeat", tu t'assures que l'image ne se répète pas. Mais en déroulant le forum, elle remontera comme toute bannière normale et si tu vas assez bas, tu ne la verras plus.

Sachant que tu peux coupler les deux, ça dépend de ce que tu veux... [et ça c'est justement ce que je n'arrive pas à comprendre : est-ce que tu veux que ton image ne se répète pas, est-ce que tu veux qu'elle soit fixe ou est-ce que tu veux qu'elle ne se répète pas et qu'elle soit fixe ?]
MessageSujet: Re: Un fond   Un fond EmptySam 18 Sep 2010, 17:02
Revenir en haut Aller en bas
Mitsu
Mitsu
{ Membre }
{ Membre }

Féminin Messages : 146



Un fond Empty
Ca marche sur mon forum test. Je vais mettre alors sur mon vrai forum mais je pense que ça sera bon.Merci beaucoup d'avoir pris de votre temps pour m'expliquer, merci ^^
MessageSujet: Re: Un fond   Un fond EmptySam 18 Sep 2010, 17:24
Revenir en haut Aller en bas
http://ginkgo-gakuen.roleaddict.com/
Ilowyn
Ilowyn
{ Membre }
{ Membre }

Féminin Messages : 36



Un fond Empty
Pas de quoi, contente qu'on en aie vu le bout^^
MessageSujet: Re: Un fond   Un fond EmptySam 18 Sep 2010, 17:25
Revenir en haut Aller en bas
http://ny-m39.forumactif.com/forum.htm
M39
M39
{ Membre }
{ Membre }

Masculin Messages : 130



Un fond Empty
Bonsoir,
Peut-on classé la demande dans les problèmes résolus ?
Merci de noter le terme résolu dans votre premier message (description) si jamais les codes sont effectivement bons ^^
MessageSujet: Re: Un fond   Un fond EmptySam 18 Sep 2010, 19:01
Revenir en haut Aller en bas
Mitsu
Mitsu
{ Membre }
{ Membre }

Féminin Messages : 146



Un fond Empty
Je voulais aussi savoir, comment faire pour mettre une image en fond comme une couleur ?
MessageSujet: Re: Un fond   Un fond EmptyDim 19 Sep 2010, 03:20
Revenir en haut Aller en bas
Contenu sponsorisé




Un fond Empty
MessageSujet: Re: Un fond   Un fond Empty
Revenir en haut Aller en bas
 

Un fond

Voir le sujet précédent Voir le sujet suivant Revenir en haut 
Page 1 sur 2Aller à la page : 1, 2  Suivant

 Sujets similaires

-
» fond + banniére fond???
» Profiter d’une bannière de fond ET d’un fond [Résolu]
» Bannière de fond + fond du body [en cours]
» Fond fixe + Fond répété
» Profiter d’une bannière de fond ET d’un fond

Permission de ce forum:Vous ne pouvez pas répondre aux sujets dans ce forum
CSSActif :: De la théorie à la pratique :: Aide CSS & xHTML :: Problèmes résolus-

Partenaires Or


← Page précédente   ↑ Aller en haut Copyright © CSSActif 2009 - 2013 Tous droits réservés
Créer un forum | ©phpBB | Forum gratuit d'entraide | Signaler un abus | Cookies | Forum gratuit