> Tous les forumsForum des Webmasters

 Aide pour une débutante en cssSujet résolu
Statut du sujet : RESOLU Imprimer
 Kirika
  Posté le 01/07/2006 @ 11:23  
 Petite astucienne

375 Messages
Bonjour , je suis en ce moment en train de crée un blog via le site over-blog.com . L'avantage de ce site est de pouvoir personnalisé comme bon nous semble notre blog via un un fichier CSS . Hors petit problème en ce qui me concerne , je débute tout juste avec le language internet ( html , xhtml , css .. ) . En parcourant le forum , je suis tombé sur un excelent site explicatif , cependant j'ai beau effectuer des changements ( aussi petits soient-ils ) dans mon css , le blog reste identique [grincheux] . Voici le css d'origine /*fichier de structure général externe*/ @import url("/css/commonstruct1.css");/*ne pas enlever cette ligne qui permet l'evolution des css personnalisés*/ /***************************************/ /* ---------- Elements Principaux ------------- */ body { margin:0px; font-family: Verdana, Helvetica, Arial, sans-serif; font-size:x-small;color:#fffff;background:#00000; } h1 { color: #5675A4; font-size: 20px; } /*titre des pages*/ h2 { color: #5675A4; font-size: 15px; } h3 { color: #5675A4; font-size: 12px; } a { text-decoration:underline; color:#5675A4; font-size:110%; } /* lien */ a:hover { text-decoration:none; color:#00000} legend { color:#5675A4; padding-left:5px; padding-right:5px;} li { list-style-type:none; } img { border:0px; } /* image */ input { border:solid 1px #D8D7D7; font-size:100%; background:#FFFFFF; color:#5675A4; } /* bouton */ /* ---------- Structure ------- */ /* La class main correspond à la structure global du blog /* le numéro après 'main' correspond au type de structure (1 2 ou trois colonne) */ /* Pour les stuctures avec 2 colonnes */ #main1 { text-align: left; margin: 0px auto 50px auto; } #main1 #rightnav { padding:10px; width:210px; } #main1 #leftnav { padding:10px; width:210px; } #main1 #content { padding:10px; border-left:1px solid #B8B8B8; border-right:1px solid #B8B8B8; } #main1 h2 { margin:0px 0px 10px 0px; padding:0px; font-size:130%; } /* Pour les stuctures avec une colonne à droite */ #main2 { text-align: left; margin: 0px auto 50px auto; } #main2 #rightnav { padding:10px; width:220px; } #main2 #content { padding: 10px; border-left:1px solid #B8B8B8; border-right:1px solid #B8B8B8; } #main2 h2 { margin:0px 0px 10px 0px; padding:0px; font-size:130%; } /* Pour les stuctures avec une colonne à gauche */ #main3 { text-align: left; margin: 0px auto 50px auto; } #main3 #leftnav { padding:10px; width:220px; } #main3 #content { padding: 10px; border-left:1px solid #B8B8B8; border-right:1px solid #B8B8B8; } #main3 h2 { margin:0px 0px 10px 0px; padding:0px; font-size:130%; } #MainTab { margin:0px; width:100%; } #MainTab td { vertical-align:top; } /* Bas de page */ #footer { clear:both; color: #333; border-top: 1px solid gray; } #footer p { margin:0px; padding: 10px; background:#ddd; } .basLien { } .basLien:hover { } .cleaner {clear:both;} /* ---------- Box ---------- */ /* correspond au block des modules */ .box { width:100%; margin-bottom:10px; } .box h2 {} .box-top { background:transparent url(/modele/2/pics/box-top-center.png) repeat-x scroll top left; } .box-left { background:transparent url(/modele/2/pics/box-middle-left.png) repeat-y scroll top left; } .box-right { background:transparent url(/modele/2/pics/box-middle-right.png) repeat-y scroll top right; } .box-bottom { background:transparent url(/modele/2/pics/box-bottom-center.png) repeat-x scroll bottom left; } .box-topLeft { background:transparent url(/modele/2/pics/box-top-left.png) no-repeat scroll top left; } .box-topRight { background:transparent url(/modele/2/pics/box-top-right.png) no-repeat scroll top right; } .box-bottomLeft { background:transparent url(/modele/2/pics/box-bottom-left.png) no-repeat scroll bottom left; } .box-bottomRight { background:url(/modele/2/pics/box-bottom-right.png) no-repeat scroll bottom right; padding:3px; } .box-content { overflow:auto; padding:0px 10px 15px 5px; color: #5675A4; } .box-content p { margin:5px 0px 5px 15px; padding:0px; } .box-content ul { margin:5px 0px 5px 15px; padding:0px; } .box-content li { list-style:square; color:#b6b6b6; margin:5px; padding:0px; } /* ---------- Recherche --- */ #Recherche { padding:0px; } #WForm { margin:0px; border:solid 1px #D8D7D7; padding:10 Je voulais mettre le fond en noir , voilà donc ma modif' /*fichier de structure général externe*/ @import url("/css/commonstruct1.css");/*ne pas enlever cette ligne qui permet l'evolution des css personnalisés*/ /***************************************/ /* ---------- Elements Principaux ------------- */ body { background-color: #00000; }{ margin:0px; font-family: Verdana, Helvetica, Arial, sans-serif; font-size:x-small;color:#fffff;background:#00000; } h1 { color: #5675A4; font-size: 20px; } /*titre des pages*/ h2 { color: #5675A4; font-size: 15px; } h3 { color: #5675A4; font-size: 12px; } a { text-decoration:underline; color:#5675A4; font-size:110%; } /* lien */ a:hover { text-decoration:none; color:#00000} legend { color:#5675A4; padding-left:5px; padding-right:5px;} li { list-style-type:none; } img { border:0px; } /* image */ input { border:solid 1px #D8D7D7; font-size:100%; background:#FFFFFF; color:#5675A4; } /* bouton */ /* ---------- Structure ------- */ /* La class main correspond à la structure global du blog /* le numéro après 'main' correspond au type de structure (1 2 ou trois colonne) */ /* Pour les stuctures avec 2 colonnes */ #main1 { text-align: left; margin: 0px auto 50px auto; } #main1 #rightnav { padding:10px; width:210px; } #main1 #leftnav { padding:10px; width:210px; } #main1 #content { padding:10px; border-left:1px solid #B8B8B8; border-right:1px solid #B8B8B8; } #main1 h2 { margin:0px 0px 10px 0px; padding:0px; font-size:130%; } /* Pour les stuctures avec une colonne à droite */ #main2 { text-align: left; margin: 0px auto 50px auto; } #main2 #rightnav { padding:10px; width:220px; } #main2 #content { padding: 10px; border-left:1px solid #B8B8B8; border-right:1px solid #B8B8B8; } #main2 h2 { margin:0px 0px 10px 0px; padding:0px; font-size:130%; } /* Pour les stuctures avec une colonne à gauche */ #main3 { text-align: left; margin: 0px auto 50px auto; } #main3 #leftnav { padding:10px; width:220px; } #main3 #content { padding: 10px; border-left:1px solid #B8B8B8; border-right:1px solid #B8B8B8; } #main3 h2 { margin:0px 0px 10px 0px; padding:0px; font-size:130%; } #MainTab { margin:0px; width:100%; } #MainTab td { vertical-align:top; } /* Bas de page */ #footer { clear:both; color: #333; border-top: 1px solid gray; } #footer p { margin:0px; padding: 10px; background:#ddd; } .basLien { } .basLien:hover { } .cleaner {clear:both;} /* ---------- Box ---------- */ /* correspond au block des modules */ .box { width:100%; margin-bottom:10px; } .box h2 {} .box-top { background:transparent url(/modele/2/pics/box-top-center.png) repeat-x scroll top left; } .box-left { background:transparent url(/modele/2/pics/box-middle-left.png) repeat-y scroll top left; } .box-right { background:transparent url(/modele/2/pics/box-middle-right.png) repeat-y scroll top right; } .box-bottom { background:transparent url(/modele/2/pics/box-bottom-center.png) repeat-x scroll bottom left; } .box-topLeft { background:transparent url(/modele/2/pics/box-top-left.png) no-repeat scroll top left; } .box-topRight { background:transparent url(/modele/2/pics/box-top-right.png) no-repeat scroll top right; } .box-bottomLeft { background:transparent url(/modele/2/pics/box-bottom-left.png) no-repeat scroll bottom left; } .box-bottomRight { background:url(/modele/2/pics/box-bottom-right.png) no-repeat scroll bottom right; padding:3px; } .box-content { overflow:auto; padding:0px 10px 15px 5px; color: #5675A4; } .box-content p { margin:5px 0px 5px 15px; padding:0px; } .box-content ul { margin:5px 0px 5px 15px; padding:0px; } .box-content li { list-style:square; color:#b6b6b6; margin:5px; padding:0px; } /* ---------- Recherche --- */ #Recherche { padding:0px; } #WForm { margin:0px; border:solid 1px #D8D7D7; padding:10 Pourtant mon fond est toujour blanc ... Merci de votre aide
 Afficher le profil de Kirika Envoyer un message privé à Kirika
 
 
Publicité
 tbkc  Posté le 01/07/2006 à 12:02  
Petit astucien

96 Messages
bonjour, peut-etre avec [code]{ bgcolor: #000000; }[/code] a la place de [code]{ background-color: #00000; }[/code]
Afficher le profil de tbkcEnvoyer un message privé à tbkc
 Revenir en haut de la page
 Kirika  Posté le 01/07/2006 à 12:12  
Petite astucienne

375 Messages
[hello] tbkc Ca ne fonctionne pas [confus]
Afficher le profil de Kirika Voir la configuration de KirikaEnvoyer un message privé à Kirika
 Revenir en haut de la page
 pastazere  Posté le 01/07/2006 à 14:48  
Petit astucien

372 Messages
Bonjour Et si au lieu de : body { background-color: #00000; }{ margin:0px; font-family: Verdana, Helvetica, Arial, sans-serif; font-size:x-small;color:#fffff;background:#00000; } tu faisais : body { background-color: #000000; margin:0px; font-family: Verdana, Helvetica, Arial, sans-serif; font-size:x-small; color:#ffffff;} En haut en rouge = ce qui a été enlevé et en bas en bleu = ce qui a été ajouté.
Afficher le profil de pastazere Voir la configuration de pastazereEnvoyer un message privé à pastazere
 Revenir en haut de la page
 Kirika  Posté le 01/07/2006 à 14:52  
Petite astucienne

375 Messages
[hello]pastazere Ca marche impecc' ! Merci beaucoup !! [chinois][chinois]
Afficher le profil de Kirika Voir la configuration de KirikaEnvoyer un message privé à Kirika
 Revenir en haut de la page
 Kirika  Posté le 01/07/2006 à 15:27  
Petite astucienne

375 Messages
Bon vu que je suis pas douée , je n'arrive pas à mettre ma bannière [triste] /*fichier de structure général externe*/ @import url("/css/commonstruct1.css");/*ne pas enlever cette ligne qui permet l'evolution des css personnalisés*/ /***************************************/ /* ---------- Elements Principaux ------------- */ body { background-color: #000000; margin:0px; font-family: Verdana, Helvetica, Arial, sans-serif; font-size:x-small; color:#ffffff;} h1 { color: #5675A4; font-size: 20px; } /*titre des pages*/ h2 { color: #5675A4; font-size: 15px; } h3 { color: #5675A4; font-size: 12px; } a { text-decoration:underline; color:#5675A4; font-size:110%; } /* lien */ a:hover { text-decoration:none; color:#00000} legend { color:#5675A4; padding-left:5px; padding-right:5px;} li { list-style-type:none; } img { border:0px; } /* image */ input { border:solid 1px #D8D7D7; font-size:100%; background:#FFFFFF; color:#5675A4; } /* bouton */ { width: 1280px; margin: auto; margin-top: auto; margin-bottom: auto; #en_tete; background-image: url("http://lakinoa.free.fr/banni%e8re%20blogg.gif"); background-repeat: no-repeat; } /* ---------- Structure ------- */ /* La class main correspond à la structure global du blog /* le numéro après 'main' correspond au type de structure (1 2 ou trois colonne) */ /* Pour les stuctures avec 2 colonnes */ #main1 { text-align: left; margin: 0px auto 50px auto; } #main1 #rightnav { padding:10px; width:210px; } #main1 #leftnav { padding:10px; width:210px; } #main1 #content { padding:10px; border-left:1px solid #B8B8B8; border-right:1px solid #B8B8B8; } #main1 h2 { margin:0px 0px 10px 0px; padding:0px; font-size:130%; } /* Pour les stuctures avec une colonne à droite */ #main2 { text-align: left; margin: 0px auto 50px auto; } #main2 #rightnav { padding:10px; width:220px; } #main2 #content { padding: 10px; border-left:1px solid #B8B8B8; border-right:1px solid #B8B8B8; } #main2 h2 { margin:0px 0px 10px 0px; padding:0px; font-size:130%; } /* Pour les stuctures avec une colonne à gauche */ #main3 { text-align: left; margin: 0px auto 50px auto; } #main3 #leftnav { padding:10px; width:220px; } #main3 #content { padding: 10px; border-left:1px solid #B8B8B8; border-right:1px solid #B8B8B8; } #main3 h2 { margin:0px 0px 10px 0px; padding:0px; font-size:130%; } #MainTab { margin:0px; width:100%; } #MainTab td { vertical-align:top; } /* Bas de page */ #footer { clear:both; color: #333; border-top: 1px solid gray; } #footer p { margin:0px; padding: 10px; background:#ddd; } .basLien { } .basLien:hover { } .cleaner {clear:both;} /* ---------- Box ---------- */ /* correspond au block des modules */ .box { width:100%; margin-bottom:10px; } .box h2 {} .box-top { background:transparent url(/modele/2/pics/box-top-center.png) repeat-x scroll top left; } .box-left { background:transparent url(/modele/2/pics/box-middle-left.png) repeat-y scroll top left; } .box-right { background:transparent url(/modele/2/pics/box-middle-right.png) repeat-y scroll top right; } .box-bottom { background:transparent url(/modele/2/pics/box-bottom-center.png) repeat-x scroll bottom left; } .box-topLeft { background:transparent url(/modele/2/pics/box-top-left.png) no-repeat scroll top left; } .box-topRight { background:transparent url(/modele/2/pics/box-top-right.png) no-repeat scroll top right; } .box-bottomLeft { background:transparent url(/modele/2/pics/box-bottom-left.png) no-repeat scroll bottom left; } .box-bottomRight { background:url(/modele/2/pics/box-bottom-right.png) no-repeat scroll bottom right; padding:3px; } .box-content { overflow:auto; padding:0px 10px 15px 5px; color: #5675A4; } .box-content p { margin:5px 0px 5px 15px; padding:0px; } .box-content ul { margin:5px 0px 5px 15px; padding:0px; } .box-content li { list-style:square; color:#b6b6b6; margin:5px; padding:0px; } /* ---------- Recherche --- */ #Recherche { padding:0px; } #WForm { margin:0px; border:solid 1px #D8D7D7; padding:10
Afficher le profil de Kirika Voir la configuration de KirikaEnvoyer un message privé à Kirika
 Revenir en haut de la page
 Dreamer  Posté le 01/07/2006 à 16:09  
Astucien


4286 Messages
Salut Je pense que le nom de de ton image doit être url ('http://lakinoa.free.fr/banni%e8re%20blogg.gif' ) pas de " , mais ' et puis simplifies le nom , pas d'accent utilises logoblogg.gif ou banniereblogg.gif . A +

Modifié par Dreamer le 01/07/2006 16:16
Afficher le profil de Dreamer Voir la configuration de DreamerEnvoyer un message privé à Dreamer
 Revenir en haut de la page
 Kirika  Posté le 01/07/2006 à 16:22  
Petite astucienne

375 Messages
Ca ne marche pas [triste]
Afficher le profil de Kirika Voir la configuration de KirikaEnvoyer un message privé à Kirika
 Revenir en haut de la page
 Kirika  Posté le 01/07/2006 à 16:32  
Petite astucienne

375 Messages
C'est bon j'ai trouvé [bigsmile] Merci !
Afficher le profil de Kirika Voir la configuration de KirikaEnvoyer un message privé à Kirika
 Revenir en haut de la page
 pastazere  Posté le 01/07/2006 à 16:43  
Petit astucien

372 Messages
Hors petit problème en ce qui me concerne , je débute tout juste avec le language internet ( html , xhtml , css .. )
Ce n'est pas un problème, tout le monde passe par là, c'est après que ça se complique [bigsmile]
En parcourant le forum , je suis tombé sur un excelent site explicatif
Lequel est-ce ? En attendant regarde tous les sélecteurs qui se trouvent au dessus de la ligne qui te tracasse. Tu vois que le sélecteur h1 est suivi d'un { ....... puis d'un } tout à la fin de ta ligne (idem pour li, pour img etc...). Tu démarres ta ligne par un { donc souci car pas de sélecteur. J'imagine que celui-ci est le div #en_tete qui n'a rien à faire là où il est.
Afficher le profil de pastazere Voir la configuration de pastazereEnvoyer un message privé à pastazere
 Revenir en haut de la page
 Kirika  Posté le 01/07/2006 à 18:16  
Petite astucienne

375 Messages
Ce site : [url]http://www.siteduzero.com/tuto-3-6-0-apprenez-a-creer-votre-site-web.html[/url] Je sais qu'il en existe beaucoup , mais c'est le seul où j'ai a peu près compris ( enfin là ça va mieux , vu que je bidouille , bidouille et rebidouille ) Merci pour tes conseilles pastazere , en fait il fallait mettre #top au lieu de #en_tête ( c'est vraiment tout con [bigsmile] )
Afficher le profil de Kirika Voir la configuration de KirikaEnvoyer un message privé à Kirika
 Revenir en haut de la page
Haut de la page 
Inscrivez-vous !
- Posez vos questions

- Résolvez vos problèmes

- Aidez les autres

- Participez et créez vos discussions

- Dialoguez en privé avec d'autres membres

- Suivez vos sujets préférés

- Affichez les signatures des membres

TOUT EST GRATUIT !

Je crée mon compte




Vous avez besoin d'aide ?
Des centaines d'experts sont à votre disposition sur les forums PC Astuces pour vous aider gratuitement, 24h/24, 7j/7.

Les derniers sujets résolus !
 

 > Tous les forumsForum des Webmasters

 
Forum PC Astuces© 1997-2008 WebastucesAller en haut de la page