Web 2016-04-14

De an
Révision de 21 avril 2016 à 16:38 par Aleray (discussion | contributions) (Exercice 2)

(diff) ← Version précédente | Voir la version courante (diff) | Version suivante → (diff)
Aller à : navigation, rechercher

Positionnement CSS

Voir la page dédiée.

Exercice 1

Mettre en ligne l'ensemble des exercices et faire une page d'accueil qui pointe vers l'ensemble de ces pages.

Exercice 2

En s'inspirant des oeuvre d'Art Cinétique et d'Op Art, créer un tableau HTML (une page HTML et CSS avec une dimension picturale, à la manière de Rafaël Rozendaal.

Cette page utilisera des trames pour jouer sur des effets de moirage par superposition. Ce tableau proposera plusieurs configurations grâce à l'utilisation des différentes propriétés de positionnement et des unités relatives ou absolues des CSS.


Ou bien

Reproduire l'une des trois œuvres ci-dessus en HTML et CSS. Pour y parvenir, vous pouvez:

  • jouer sur la structure du HTML et l'imbrication des balises;
  • utiliser la règle CSS position avec pour valeurs (à vous de décider) relative, absolute ou fixed;
  • utiliser la règle CSS text-align avec pour valeurs (à vous de décider) right, center ou left;
  • utiliser les règle CSS margin (marge exterieure) ou padding (marge intérieure);
  • toute autre règle CSS qui vous semble convenir.

En revanche:

  • vous ne pouvez pas utiliser de tableaux.

Vous pouvez travailler par deux ou par trois. Vous devez chacun mettre en ligne le résultat sur votre espace FTP personnel (sur chaque compte).

Vous devez également utiliser des unités relatives (par exemple %) plutôt que des unités absolues (par exemple px) afin que le résultat soit redimensionnement en conservant les proportions. L'exactitude au pixel prêt n'est importante, je préfère que l'accent soit mis sur la mise en page relationnelle (les éléments sont placés de manière relative les uns aux autres).