User Tools

Site Tools


2013_2014:s1:docweb:placements

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
Last revision Both sides next revision
2013_2014:s1:docweb:placements [2013/12/09 16:42]
rey [Les transformations en css]
2013_2014:s1:docweb:placements [2013/12/11 09:15]
blay [Structure]
Line 7: Line 7:
    - Commencez par créer une page html5 contenant une zone ''​header'',​ une zone ''​nav'',​ une zone ''​aside'',​ 5 zones ''​section''​ et une zone ''​footer''​.    - Commencez par créer une page html5 contenant une zone ''​header'',​ une zone ''​nav'',​ une zone ''​aside'',​ 5 zones ''​section''​ et une zone ''​footer''​.
   - A l'aide d'un fichier CCS, définissez les propriétés suivantes pour les zones :   - A l'aide d'un fichier CCS, définissez les propriétés suivantes pour les zones :
-    * hearder ​: prend toute la largeur de la page, contiendra un texte de 40px de haut et en petites capitales+    * header ​: prend toute la largeur de la page, contiendra un texte de 40px de haut et en petites capitales
     * nav sera une zone horizontale sous le header de 600px de large (on y reviendra à la fin)     * nav sera une zone horizontale sous le header de 600px de large (on y reviendra à la fin)
     * aside : est une colonne alignée à droite de 200px de large (voir plus bas pour le contenu)     * aside : est une colonne alignée à droite de 200px de large (voir plus bas pour le contenu)
Line 82: Line 82:
   * les cases/​cellules impaires sont **inclinées** de 15deg (''​skewX''​) et ont des bords arrondis ​ (''​border-radius''​) de 10px   * les cases/​cellules impaires sont **inclinées** de 15deg (''​skewX''​) et ont des bords arrondis ​ (''​border-radius''​) de 10px
   * les cases/​cellules paires sont **tournées** de 5deg (''​rotate''​) et ont des bords arrondis de 20px   * les cases/​cellules paires sont **tournées** de 5deg (''​rotate''​) et ont des bords arrondis de 20px
 +  * Il faudra également mettre le tableau en forme comme dans l'​image ci-dessous
 </​box>​ </​box>​
  
2013_2014/s1/docweb/placements.txt · Last modified: 2014/02/04 14:51 by blay