ciel-b1/src/cours/CIEL1/04-web-statique/web-statique.md

50 lines
No EOL
1.5 KiB
Markdown
Raw Blame History

This file contains invisible Unicode characters

This file contains invisible Unicode characters that are indistinguishable to humans but may be processed differently by a computer. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.

# Le Web statique
## Lancer un serveur web
### En développement
`python3 -m http.server`
Puis `http://localhost:8000`
### En production
Apache, nginx...
Voir à la fin d'un TP
## HTML : structurer et donner du sens au contenu
### Bases
[MDN - Introduction au HTML](https://developer.mozilla.org/fr/docs/conflicting/Learn_web_development/Core/Structuring_content_2f5dc6d6e575054cc70e0a8faa24bef31907d53cee6754dd2c92e644e705a7d8)
### Debug
[MDN - Debug HTML](https://developer.mozilla.org/fr/docs/Learn_web_development/Core/Structuring_content/Debugging_HTML)
### Multimédia
images, audio, video
### Tableaux
### Point sur l'accessibilité (ou intégrer au fil du temps ?) et les bonnes pratiques
### Balises de formulaire (à voir avec le JS ?)
## CSS : donner du style au contenu
### Bases
- sélecteur > accolades > `propriétés: valeurs;`
- Intégrer la CSS dans la page
- Mise en forme et modification du comportement par défaut
- Sélections : classes, état, position, combinaisons, cascades (bonus: pseudo classes et pseudo éléments)
- Propriétés et valeurs
- fonctions
- @rules -> @import et @media
- propriétés raccourcies (border, padding...)
- boîtes et flex
### Debugger du CSS
Firefox powaa
## Ressources supplémentaires
MDN Web Docs, section Learn: https://developer.mozilla.org/fr/docs/Learn_web_development
ou section référence : https://developer.mozilla.org/fr/docs/Web
# Orga
## TP
- Découverte du HTML + bases CSS
- Styler une page web avec CSS (boîtes et flex)