Bonjour, on m'a confié pour mission de relooker un site pour un public "jeunes". Pour cela, on m'a dit de passer du html au CSS.  
 
J'aurai aimé savoir comment passer du html au CSS et quels sont ses avantages dans le relookage d'un site ?

mise en page par html = modification plus ou moins profonde du code de la page pour chaque changement d'apparence et utilisation de balise au mépris de leur signification réelle ce qui rend le site peu compréhensible pour ceux qui ont des problémes de vues ou qui utilsient des navigateurs en mode texte
 
mise en page en css = utilisation des balises html en fonction de leur signification et au mépris de leur affichage par défaut et modification de l'affichage des éléments par les régles définis dans le css. Du coup, on peut changer l'apparence du site sans rien modifier au niveau du code html et le site sera facilement compréhensible pour un visiteur qui a de gros probléme de vue.

Pour passé du html au CSS, ben tu dois pas avoir tout compris toi
 
On passe pas de l'un à lautre..ou se sert de CSS pour styler de l'html...
 
Pour toi:  
http://www.csszengarden.com/  
http://www.alsacreations.com  
http://openweb.eu.org/
 
Tiens

merci  
 
mais coment se sert-on de css pour styler du html ???

tu as lu les sites que xtof t'a donné    
je crois pas    
 
tiens je te les redonne  
http://www.alsacreations.com  
http://openweb.eu.org/

mais c'est du charabia pour moi aussi !!!
 
j'aimerais du concret style "faire fichier ouvrir ...."

Oui oui....tu veux pas une sucette en même temps...
 
ici c'est coin programmation, pas newbs à la recherche d'une personne à exploité... La programmation c'est pas magique...
 
Sinon nous on serais plus là

 
ce genre de relookage, ça se fait pas automatiquement via une fonction toute faite prête à l'emploi d'un soft. Un simple éditeur de texte suffit, mais il faut bien connaître le html, le css et qq astuces car dès qu'on veut faire un site visible sur tous les navigateurs, ça commence à devenir très galère (cf. le modèle boîte de IE <> de la norme)...
 
un autre site pour vérifier au fil de l'eau que ce que tu fais est correct : http://validator.w3.org/

allez et puis si tu veux une vrai bible va sur ce site tout est d'une limpidité étonnate....  
  http://www.w3schools.com/ y a rien mieux

Salut à tous, pour rester dans le sujet Besoin de conseil CSS, je vous expose mon pb:
Je souhaiterais positionner 2 DIV sur un meme niveau mais lors du redimensionnement de la page (par l'utilisateur ou du à la résolution 800x600 par exemple) les DIV n'imposent pas le déplacement horizontal (très relou) et se mettent gentillement l'un sous l'autre...
 
|[DIV]   [DIV]|
 
|  [DIV]  |
|  [DIV]  |

j'ai une autre question sinon, comment rendre un site dynamique fait pour les "jeunes" ?

 
Si tu défini une largeur au conteneur de ces deux div et que tu définis ensuite une largeur relative (%) pour chacun des div dont la somme ne dépasse évidemment pas 100%, ça marchera.
 
Il faut également faire en sorte que le conteneur des div ne puisse être redimensionné au délà d'une certaine valeur, pour cela tu as plusieurs options:
 
Pour les navigateurs modernes, la clause min-width: est prévue à cet effet, seulement comme IE est un browser génial, il ne la reconnait pas, et il faut donc appliquer un code css particulier pour IE.

Ben ajoute du style CSS à ton code!!

oula attend jvé tester ça

:S largeur et % en meme temps?

 
Qu'entends-tu par dynamique ? interaction poussée avec le site ? si c'est le cas tout dépend de ce que tu veux faire (côté client ou côté serveur)...le js et le php seront à mon avis de rigueur pour ce genre de projet.

<div style='position:absolute;left:0px;overflow: hidden;width: 300px;height: 200px;'>
        <span id='defileH1' style='position:absolute;width:300px;' onMouseover="defileH_1.delta=0" onMouseout='defileH_1.delta=deltaH1'>
        ...
 </span>
</div>
 
<div style='position:absolute;right:0px;margin-left:0px;overflow: hidden;width: 300px;height: 200px;'>
        <span id='defileH2' style='position:absolute;width:300px;' onMouseover="defileH_2.delta=0" onMouseout='defileH_2.delta=deltaH2'>
        ...
 </span>
</div>
 
 
Mon code actuel

 
tu as un conteneur, tu lui appliques une certaine largeur (relative ou fixe, tout dépend de sa position hiérachique dans la structure de la page et de tes déclarations).
 
Mais supposons que ce conteneur ai une largeur fixe de xxx pixels: pour tes deux div à l'intérieur de ce conteneur, il verront sa largeur comme étant 100% (je te conseille de lire qques tutos sur les modèles de boites en css, dimensions relatives et fixe).
 
Donc il faudra que la somme de la largeur de tes 2 div, si elle est déclarée en % (valeur relative a celle de leur conteneur) ne dépasse pas 100% (sinon ça voudrait dire qu'elle dépasse celle du conteneur et tes blocs se mettront l'un au dessus de l'autre justement.

houla bon, je préfère te dire que je ne lis jamais du code html avec une css interne, c'est horible et illisible. met la dans un fichier séparé qu'on y voit plus clair.

http://webtoulon.free.fr/essai.html
 
voila g séparé le style et j'ai mis en ligne pour que tu vois, j'aimeré pouvoir faire en sorte que mes deux colones passent l'une sous l'autre pour des petites résolutions ou redimensionnement de l'écran...
 
Ca fait pas longtemps que j'utilise les DIV, j'ai appris en me débarrassant des frames...

Bon, heum y a pas mal de choses à modifier pour avoir qqch de correct
 
- Ton code js est incompatible avec les navigateurs autre que IE, donc poubelle
 
- vire toutes les infos de style type html qui trainent un peu partout dans ton code (width, border etc..)
 
- toutes ces tables successives berk, soit t'en fait une seul soit tu travailles qu'avec des div
 
- les attributs de positionnement css en absolu et relative c'est à supprimer aussi

ah merde moi qui cherche justement à faire kelke chose de compatible, jvoulé me débarrasser de MARQUEE balise html pour IE (là j'avais pas de pb de redimensionnement pa rocntre)
 en cas si kelkun conné un bon script compatible pour le défilement d'images

Voila le site que je dois relooker www.gigaweb53.fr
 
comme vous pouvez le voir, il est loin d'être dynamique surtout pour un site destiné à un public jeune. Quels seraient les méthodes pour qu'il ressemble à un site comme ça : www.lesondines.org

 
Tu peux préciser ce que tu entend par dynamique pour ton site et ce que tu souhaite mettre en place ?

un bloc avec un lien vers la radio du site qui bouge comme on voit sur beaucoup de sites maintenant

:

ben orientes toi plutôt vers le flash dans ce cas

le flash c'est à dire javascript ??

meme pas la force de commenter

désolé mais je n'ai aucune connaissance en programmation, je comprend que ca doit vous choquer ce que je dis, mais j'essaie d'avancer

Ok mais vois-tu ici la majorité des forumeurs sont des développeurs proffesionnels qui connaissent les normes en vigueur, les différents languages exploitables dans le domaine, les techniques avancées etc.
 
Alors quand tu dis "flash c-a-d javascript" ça a effectivement de quoi surprendre !
 
Le mieux que l'on puisse te conseiller au vu de l'étendu de tes connaissances actuelles, c'est soit d'acheter un ou plusieurs livres sur le wedeveloppement (c'est jamais perdu), soit d'apprendre via les les tutoriaux existant sur le web (et il y a en a.....) Ici on aide ceux qui s'y connaissent quand même un minimum, mais pour les cours sorry c'est pas au programme.
 

en fait on fais des pages css et on les intègre dans des pages  html ?

Non.
Comme on t'a dit, lis les sites d'apprentissage, car il faudra bien a un moment que tu comprennes un minimum ce que dois faire.
D'autre part, j'ai pas vraiment vu en quoi le second site etait plus dynamique que le premier, a moins que pour toi, dynamique ca signifie la liste de gauche qui change de couleur quand la souris passe dessus.
La second site a un design mieux fichu, mais il m'a pas l'air particulierement dynamique.
A+,

hummm tu pourrais nous dire pourquoi on t'a demander de relooker un site web alors que tu n'as même pas 1% des connaissances nécessaires pour faire un site web ?
je suis quand même septique.
 
Le gars qui t'a demandé ça doit être suicidaire

je suis en BTS Informatique de Gestion mais je n'ai comme connaissances que le HTML.

Raison de plus pour lire les sites que l'on t'a donné  
je te conseille le lien là, qui commence petit à petit.
 
http://mammouthland.free.fr/cours/css/index.php
 
En plus le site actuel que tu veux modifier est en partie basé sur les CSS
sauf qu'il y a énormément de commentaires dans le code HTML alors que ceux-ci auraient pu être mis dans PHP

En fait le CSS c'est juste pour faire un site  plus joli avec des couleurs de la transparence etc...
Tu fais pas une page en CSS uniquement. Tu fais ta page HTML sans  "mise en page", et puis tu crée ta feuille de style avec les couleurs y tout y tout ^^
Enfin c'est comme ca que je le vois...

merci

Bonsoir gros pb!!
http://webtoulon.free.fr/Structure
et http://webtoulon.free.fr/Structure/miseenpage.css
 
Je souhaiterais voir ma partie centrale prendre toute la place disponible!
Le tout étant contenu dans un tableau et le menu de gauche et de droite ayant une taille fixée, je ne comprends pas pourquoi la partie centrale impose sa dimension!
 
g remarqué que ceci apparaissait uniquement lors de la présence de tableaux dans le DIV inférieur et que le pb n'apparait nulement sur firefox... merci par avance de votre aide