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 revisionPrevious revision
Next revision
Previous revision
2013_2014:s1:docweb:placements [2013/12/09 15:42] – [Les transformations en css] rey2013_2014:s1:docweb:placements [2014/02/04 13:51] (current) – [Structure] blay
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 27: Line 27:
  
 <note tip>Ces références doivent apparaître sur toutes vos pages au sein de l'IUT. Nous les utiliserons pour vérifier la validité de vos pages.</note> <note tip>Ces références doivent apparaître sur toutes vos pages au sein de l'IUT. Nous les utiliserons pour vérifier la validité de vos pages.</note>
 +
 +Vous pouvez aussi ajouter :  http://validator.w3.org/checklink
 +
 </box> </box>
 ===== Positionnement en CSS ===== ===== Positionnement en CSS =====
Line 82: Line 85:
   * 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.1386603722.txt.gz · Last modified: 2013/12/09 15:42 by rey