User Tools

Site Tools


2016_2017:s1:webdoc:td6

Differences

This shows you the differences between two versions of the page.

Link to this comparison view

Both sides previous revision Previous revision
Next revision
Previous revision
2016_2017:s1:webdoc:td6 [2016/12/05 16:54]
logre [Les navigateurs mobiles]
2016_2017:s1:webdoc:td6 [2016/12/09 09:18] (current)
logre [Et en pratique ?]
Line 88: Line 88:
 } }
 </​code>​ </​code>​
 +
 +Pour d'​autres exemples au besoin : [[https://​course.oc-static.com/​ftp-tutos/​cours/​html-css/​p4/​ch5/​media_query_base/​index.html|Un ici]], [[http://​www.alsacreations.com/​article/​lire/​930-css3-media-queries.html|quelques uns là]], [[http://​dailygeekshow.com/​wp-content/​uploads/​2014/​11/​mouton.jpg|et pourquoi pas ?]]
  
 ===== Un pas de recul ===== ===== Un pas de recul =====
Line 149: Line 151:
   * Théoriquement,​ quelle autre media query devrait nous éviter ce problème ? Pourquoi ne fonctionne-t-elle pas ?   * Théoriquement,​ quelle autre media query devrait nous éviter ce problème ? Pourquoi ne fonctionne-t-elle pas ?
 </​box>​ </​box>​
 +
 +
 +===== Et en pratique ? =====
 +
 +Une bonne idée est de limiter les menus latéraux sur les petits écrans verticaux voir d'​éliminer les menus qui défilent avec le scroll.
 +Cela nécessite de restructurer sa page.
 +
 +<box round rgb(185,​211,​238) 95%|**A Faire** :  >
 +  * Concevez ou reprenez une page web disposant d'un menu visible à tout instant et d'une colonne à gauche et à droite présentant respectivement le menu de la page et les partenaires du site.
 +  * Ecrivez le CSS nécessaire à l'​adaptation de cette page à une navigation sur mobile. Testez.
 +  * Quels changements proposez-vous pour une adaptation vers un écran géant 40" ? Implémentez-les dans votre CSS.
 +</​box>​
 +
  
  
2016_2017/s1/webdoc/td6.1480953252.txt.gz · Last modified: 2016/12/05 16:54 by logre