Proposition 1
Transcription
Proposition 1
CORRIGE TYPE I. PARTIE THÉORIQUE : (20/20) QCM (+2 bonne réponse) Possible d’avoir plusieurs choix dans la même question Q1. Comment faire un saut de ligne ? Avec la balise <P> Avec la balise <BR> Avec la balise <S> Q2. Quelle balise permet de mettre un texte en gras ? <G></G> <B></B> <ST></ST> Q3. Quelle balise permet de mettre un texte en exposant ? <SUP></SUP> <SUB></SUB> <EXP></EXP> Q4. Laquelle de ces balises donne le titre de plus grande taille ? <H1> <H3> <H6> Q5. Dans quelles balises insère-t-on le corps du site (ce qui est directement visible par le visiteur) ? <HEAD></HEAD> <BODY></BODY> <A></A> Q6. Que signifie le sigle CSS ? Coordoning Style Sheets Cascading Style Sheets Cascading Style Sheats Q7. Quelle propriété du background n'existe pas ? Background-font Q8. A quoi correspondent les valeurs réspéctives du code suivant : 'margin : Marge : haut droite bas gauche Marge : droite haut gauche bas Marge : droite bas gauche haut Q9. Quelle syntaxe sert à définir une classe ? . header #header Header Q10. Qu'affichera le bloc <div id='header'></div> avec le css #header { background : red url(images/header. png) no-repeat scroll 0 0; } L'image header. png La couleur rouge Rien du tout II. PARTIE PRATIQUE : (20/20) Exercice 1 Expliquer chaque ligne de code html suivant (10p) <ol id="menu" class="simple_menu simple_menu_css horizontal black_menu"> <li><a href="index.html">Home</a></li> <li><a href="#">Templates</a> <!-- sub menu --> <ol> <li><a href="gallery.html">Gallery</a></li> <li><a href="cinema.html">Cinema</a></li> <li><a href="slider.html">Nivo Slider</a></li> <li><a href="columns.html">Columns</a></li> <li><a href="tabs.html">Tabs</a></li> <li class="last"><a href="photogrid.html">Photo Grid</a></li> <li><a href="image.html">Static Image</a></li> </ol> <!-- end sub menu --> <li><a href="portfolio.html">Portfolio</a></li> <li><a href="fullscreen-gallery.html">Fullscreen Gallery</a></li> <li class="last"><a href="news.html">News</a></li> </ol> <div class="clr"></div> <!-- menu 2 --> <ol id="menu2" class="simple_menu simple_menu_css horizontal black_menu"> <li><a href="gallery.html">Portraits</a></li> <li><a href="gallery.html">Landscapes</a></li> <li class="last"><a href="gallery.html">Wildlife</a></li> </ol> CE CODE PERMET D’AFFICHER LA LISTE SUIVANTE QUI EST LA BAS D’UN MENU DE NAVIGATION 1. Home 2. Templates 1. Gallery 2. Cinema 3. Nivo Slider 4. Columns 5. Tabs 6. Photo Grid 7. Static Image 3. Portfolio 4. Fullscreen Gallery 5. News 1. Portraits 2. Landscapes 3. Wildlife Exercice 2 Expliquer chaque ligne de cette partie de feuille de style .float_left { float: left; background: #1A1A1A; height: 170px; width: 175px; border: 1px solid #CCC; box-shadow: 3px 3px 3px #e3e3e3; margin: 0px 0px 13px 13px; padding-top: 9px; text-align: center; } Position à gauche Arrière-plan La longueur 170px La largeur : 175 px Bordure 1p solide avec une couleur L’ombre Les marges extérieures Les marges intérieures Alignement de texte centré (10p)