TD2 - Université d`Angers
Transcription
TD2 - Université d`Angers
Université d’Angers Développement Web TD2 – Premières notions de CSS2 Vous pouvez n’avez pas à réécrire toute la page de départ. Indiquez uniquement ce qui doit se trouver entre les balises <body >et <body /> Exercice 1 : Q 1 . Que fait le CSS suivant ? * { background-color :green ; } h1, p { text-align :right ; font-family :Aigrette, ’’Times New Roman’’, sans-serif ; } h2 { font-style :italic ; /* font-style :oblique ; */ text-transform :capitalize ; text-decoration :underline ; background-color :yellow ; font-family :Arial; } p .toto { font-family :Pigeon, serif ; font-size :40px ; color :blue ; } #titi { font-weight :bold ; font-variant :small-caps ; color :red ; } Q 2 . Qu’est-ce qui sera écrit en bleu dans le texte suivant ? <h1 class="toto"> Mon titre </h1> <p> Mon premier paragraphe </p> <p class="toto"> Mon second paragraphe et <q>ma citation </q></p> <p> Mon <span class="toto"> troisième </span> paragraphe </p> <p> Mon <span class="toto"> troisième, oups <span> quatrième </span></span> paragraphe </p> <blockquote class="toto"> <p> Ma sitation longue </p></blockquote> Q 3 . Sans modifier le document XHTML, écrire un fichier CSS permettant les mises en formes suivantes : 1. Les titres de niveau 1 sont en lettres capitales minuscules. 2. Les titres de niveau 2 sont soulignés. 3. Les paragraphes sont en gris. 1/2 4. Les textes importants de classe c1 apparaissent en rouge, ceux de classe c2 sont en italique et violet. 5. Les citations sont en bleu et italique si elles sont contenues dans un paragraphe, mais apparaissent droites sur fond vert si elles sont contenues dans un titre h1 ou h2. Q 4 . De quelle couleur sera écrit le “et encore important !” Exercice 2 : La figure suivante montre mon arborescence de fichiers. Q 1 . Quelle instruction dois-je mettre pour que le fichier exemple.html utilise le CSS contenu dans le fichier general.css ? Et dans quelle fichier dois-je la mettre ? Q 2 . Quelle instruction dois-je mettre pour que exemple.html qui utilise le CSS de general.css affiche comme image de fond logo.png en bas à gauche de l’écran ? Q 3 . Est-il possible d’avoir sur la même page Web d’autres images que l’image de fond ? Et si oui comment ? 2/2