Forum-webmaster
Technique - programmation => HTML / CSS / XHTML => Message commencé par: KiwiMan le le 25-09-2011 a 18:04:04

Titre: Analyse d'un CSS : Qui fait quoi ?
Posté par: KiwiMan le le 25-09-2011 a 18:04:04

Bonjour à toutes et à tous,
Je me lance en ce moment dans le " développement " de sites Internet, via un outil ( Webnode ) qui propose des modèles prédéfinis. J'aimerais cependant y ajouter une touche de personnalisation, car certains détails me chiffonnent ; pour cela, j'ai tenté de me pencher sur l'analyse des CSS en faisant avec mes maigres connaissances... Le seul résultat que j'ai réussi à obtenir fut de rendre invisible mon texte ( alors que je tentais de rendre vert le fond de la page ! ).

Voici un lien vers la page Internet, sur laquelle vous trouverez également le CSS afin de ne pas encombrer le message : cliquez ici. (http://kiwi-juice.webnode.fr/code-css/)

Je vous pose maintenant deux questions :
1) Comment faire pour changer la couleur du fond de la zone du haut, actuellement en bleu, en un vert #006400 ( ou quel qu'il soit si celui-ci n'est pas valide ).
2) Comment faire pour agrandir la zone colorée dont je viens de parler ?


Merci d'avance de votre aide !
Kiwi Man

Titre: Re:Analyse d'un CSS : Qui fait quoi ?
Posté par: Pad le le 25-09-2011 a 21:09:10

salut,

1. le fond bleu n'est pas défini en css mais avec une image de fond : http://kiwi-juice.webnode.fr/img/site_bg.png (http://kiwi-juice.webnode.fr/img/site_bg.png). Faudra donc faire une nouvelle image avec un dégradé vert comme tu le souhaites.

2. agrandir l'image de fond ou/et préciser au style css correspondant sa dimension. Le style en question est #siteBg (ligne 56) et il faut modifier le height en px

Titre: Re:Analyse d'un CSS : Qui fait quoi ?
Posté par: KiwiMan le le 25-09-2011 a 21:53:48

Merci de ces réponses, je vais essayer !
Juste une autre question : pour l'image de fond, dois-je moi-même l'héberger, via ImageShack par exemple, ou est-ce que je peux le faire passer par Webnode directement ?


Merci encore,
Kiwi Man

Titre: Re:Analyse d'un CSS : Qui fait quoi ?
Posté par: Pad le le 25-09-2011 a 22:07:32

tout dépend du fonctionnement de webnode... je ne le connais pas donc je pourrais pas te dire ! Regarde déjà si c'est possible de modifier cette l'image, si tu trouves ça tu trouvera comment la modifier

Titre: Re:Analyse d'un CSS : Qui fait quoi ?
Posté par: KiwiMan le le 25-09-2011 a 22:08:30

D'accord, merci, j'essaierai ça demain, pas la motivation de le faire ce soir. Je vous tiendrais au courant, et j'espère que vous serez encore là pour m'aider si besoin ;)

Kiwi Man

Titre: Re:Analyse d'un CSS : Qui fait quoi ?
Posté par: KiwiMan le le 26-09-2011 a 20:15:14

Hello,
Alors j'ai un petit problème.
Lorsque je tente de prendre un modèle d'un autre site ( qui donne ceci : background: #FFFFFF url(../img/site_bg.jpg) repeat-x left top; ), supposé me le mettre avec un motif vert vaguement dégradé ; cependant, lorsque je l'applique, tout mon fond devient blanc. Et j'ai essayé de modifier avec un rouge quelconque, tout le site devient rouge.
Donc, j'en ai déduit que le " background ' ne modifiait pas que la zone du haut, mais la totalité de l'image. Ce que je ne comprends pas, au passage, mais là n'est pas le sujet : comment puis-je faire, à votre avis, pour changer de couleur de fond ?
Peut être est-ce impossible afin que Webnode sécurise ses CSS ? Il propose cependant d'en Héberger, pensez-vous que je puisse faire copier / coller le tout et héberger l'image sur un site ?


Kiwi Man

Titre: Re:Analyse d'un CSS : Qui fait quoi ?
Posté par: Murielp le le 26-09-2011 a 20:38:50

Décomposons ton code pour mieux comprendre ...
background: #FFFFFF
donne une couleur à l'arrière-plan
url(../img/site_bg.jpg)
affiche une image devant l'arrière plan
repeat-x
sert à répéter une image horizontalement
left
... aligné à gauche
top;
... et en haut

Pour les codes de couleur, je te donne ce site :
http://www.code-couleur.com/

Pour les effets CSS, je te donne ce site :
http://css3generator.com/

N'hésite pas à m'écrire si tu as besoins d'aide ;)

Titre: Re:Analyse d'un CSS : Qui fait quoi ?
Posté par: vieactu le le 27-09-2011 a 14:17:48

si tu veux t'amuser avec un outil intéressant et te faire la main tu peux utiliser Firebug sur Firefox =)

Titre: Re:Analyse d'un CSS : Qui fait quoi ?
Posté par: KiwiMan le le 27-09-2011 a 19:04:17

A quoi sert cet outil ?

Titre: Re:Analyse d'un CSS : Qui fait quoi ?
Posté par: Murielp le le 27-09-2011 a 19:14:24

Firebug permet en un coup d'œil de réunir les informations sur une page internet.
http://www.siteduzero.com/tutoriel-3-31228-firebug-une-merveille-de-plus-pour-firefox.html

Il permet entre autre de pouvoir modifier le CSS que pour toi ... sans le modifier réellement sur le site.


Titre: Re:Analyse d'un CSS : Qui fait quoi ?
Posté par: KiwiMan le le 27-09-2011 a 19:40:38

Sur le papier ( d'internet ), ça a l'air vraiment bien ;)

Merci, je vais aller essayer ça prochainement.


Forum-webmaster | Actionné par YaBB SE
© 2001-2003, YaBB SE Dev Team. Tous droits réservés.