Téléchargez et décompressez ce fichier
Double cliquez sur le fichier index.html : cela ouvre le fichier dans votre navigateur préféré.
Ce fichier est la base du site et importe tout les autres
fichier du projet.
TP : html_css_1_tp.pdf
(à finir idéalement pour la deuxième formation)
Support de cours : html_css_2.zip
(ouvrir le dossier et cliquer sur index.html)
TP : html_css_2_tp.pdf
Essayez d'organiser votre projet, ça vous fera gagner beaucoup de temps par la suite. Par exemple :
* Dossier "projet" :
* Dossier "html" :
* home.html
* forum.html
* Dossier "css" :
* home.css
* forum.css
* Dossier "pictures" :
* logo.png
* photo.jpg
Même si cela n'est pas obligatoire en HTML et CSS, aérez votre code, donc concrètement :
Ne faites pas ça :
table {font-family: "Montserrat Light", "Arial Black", Arial, serif; border: 1px solid black;}
th {text-align: left; background-color: lightgrey ; padding: 2px;}
Mais plutôt ça :
table {
font-family: "Montserrat Light", "Arial Black", Arial, serif;
border: 1px solid black;
}
th {
text-align: left;
background-color: lightgrey;
padding: 2px;
}
Petit truc à ne pas oublier pour aller plus vite :
.my_block {
margin: 1px 2px 3px 4px;
}
Dans le sens horaire : top, right, bottom, left
A la place de ça :
.my_block {
margin-top: 1px;
margin-right: 2px;
margin-bottom: 3px;
margin-left: 4px;
}
Pour l'utilisation de Flexbox, cette page est assez complète sur les fonctionnalités de base: Flexbox-OpenClassrooms
Pour les perfectionnistes (ou juste ceux qui veulent voir s'ils ont fait des fautes de syntaxe) :