Activité 0 : Fiche de renseignement
Partie 1 : HTML / CSS
Pour ce premier cours de l'année, vous réaliserez une fiche de renseignement à l'aide d'une fiche existante et des langages fondamentaux du web HTML et CSS. Vous apprendrez la différence entre le contenu d'une page, qui se trouve dans le fichier HTML et le style d'une page, dans le fichier CSS.
Compétences travaillées :
- Langages HTML et CSS - Distinguer ce qui relève du contenu d'une page et de son style de présentation.
- Langages HTML et CSS - Etudier et modifier une page HTML simple.
Ressources à télécharger
Clic droit → Enregistrer la cible du lien sous...
Déroulé
Vous traiterez les étapes suivantes dans l'ordre et répondrez aux questions associées sur une feuille blanche. En cas de difficulté, n'hésitez pas à me solliciter.
1.
Créez un dossier SNT puis dans ce dossier, un dossier activite_00 dans le dossier Mes Documents.
Téléchargez les fichiers ressources depuis le site et copiez les dans ce dossier.
2.
Double-cliquez sur le fichier identite.html.
Que se passe-t-il ?
3.
Ouvrir le fichier identite.html dans un Ă©diteur de texte et dans un navigateur web.
Dans l'éditeur de texte, identifiez à quelle ligne est écrit le nom et le prénom Jean Dupont. Qu'est-ce qui encadre ce nom et ce prénom ?
4.
Modifier Jean Dupont par votre prénom et votre nom puis rechargez la page web.
Que constatez-vous dans le navigateur web ?
5.
Modifier le reste des informations du fichier HTML par vos informations personnelles, Ă savoir :
- le métier que vous voudrier faire
- votre age
- votre ville
- votre adresse email
6.
Ajoutez les informations personnelles suivantes :
- vos hobbies
- votre date de naissance
- votre chanson préférée
7.
Repérez la ligne où est écrit poussin.jpg.
A votre avis, que fait cette ligne ?
8.
Remplacez la photo du poussin par une photo de votre animal préféré que vous aurez préalablement récupéré sur internet.
9.
Ouvrez maintenant le fichier style.css.
Changer la ligne 2 par background-color:#red; puis rechargez la page web.
Que constatez-vous ?
10.
A l'aide de la page suivante, modifiez le style de la pase web selon vore envie.
11.
Partagez votre travail avec l'enseignant suivant les modalités qui vous seront communiquées pendant le cours.
Bravo, vous avez terminé cette première activité de l'année.
Nous reviendrons sur cette activité lors du cours suivant.