Comment faire la même page que WRI

[ravecarl]

bonjour à tous,
comment faire la même page que WRI pour les 2 dimensions d'écran ?

Merci à tous
Ravecarl

 

[moktoipas]

Fait un designe qui s'adapte a TOUTEs les largeurs d'ecran, c'est bien plus pratique (pour les visiteurs)

 

[tom_sawyer]

apprendre la mise en page CSS et faire deux feuilles de style différentes

 

[Borower]

Un petit tour sur http://css.alsacreations.com et tu trouveras ce que tu veux.

 

[CrazyCow007]

Comment ça la page WRI pour les 2 dimensions d'écran ? (la largeur du nouveau design WRI est simplement de la largeur de l'écran ?)

 

[tom_sawyer]

tu as le choix sur la page d'accueil (à droite des onglets de menu)

 

[Seb-]

Et aussi http://www.openweb.eu.org :wink:

 

[Amaryllid]

comment faire la même page que WRI pour les 2 dimensions d'écran ?

Bonjour,
<Aparté> Tient, je n'avais pas encore remarqué. Je ne viens plus assez souvent...</Aparté>

Voici la piste de recherche :
Voir le code de la page d'accueil de WRI, en particulier les lignes
- 42-47 (Les boutons qui s'affichent pour choisir une feuille de style par son nom, "thin" ou "large", et qui font appel à un JavaScript, un "styleswitcher".)
- 20 (lien du JS en question : styleswitcher.js, qui va mémoriser le choix dans un cookie)
- 10-11 (Les feuilles de style utilisées).

Vous avez besoin de maitriser
- l'écriture des feuilles de styles externes (CSS),
- la façon d'utiliser les sortes de feuilles de style permanente / préférée / alternative (voir lignes 10-11 du code : attributs rel et title en particulier. Il y a surement une page à ce propos dans OpenWeb, sinon voir ma page http://www.amaryllidaceae.org/web-jardi ... .htm#style)
- la façon d'utiliser un JavaScript simple et en particulier le styleswitcher.js que vous trouverez tout fait sur le web avec les explications en anglais (http://alistapart.com/stories/alternate/).

Insistons sur le fait que ce JS ne sert pas (qu')à adapter une page à la résolution d'écran. Pour ce faire, suivre le conseil de moktoipas : faire une mise en page fluide. Il n'existe pas que 2 résolutions d'écran !!! et les fenêtres de navigateurs ne sont pas toujours / souvent en plein écran...
Le styleswitcher.js est un outil simple pour choisir entre plusieurs présentations (mise en page, fonts, couleurs différentes...) pour les pages d'un site. C'est utile en attendant que tous les navigateurs permettre eux-même le choix de la feuille de style.