 |
lycée Follereau | Accueil | |
Gestion des fichiers
Gestion des pages
Nouvelle page
Numéro de la note "num" | (sous page,ordre) | premiers caractères de la note.
Bienvenue sur le site des classes prépas du lycée Raoul Follereau de Belfort
| Sous-page 0 | |||
| 1 | | (0,10) | | ... | |
| 38 | | (0,20) | | Actualités : Portes ouvertes CPGE : samedi 27 ja... | |
Qu'est-ce que la prépa ?
| Sous-page 0 | |||
| 6 | | (0,1) | | Rubriques : | Pourquoi venir en prépa ? | ← vous ... | |
| 4 | | (0,10) | | Qu'est-ce que c'est ? Les CPGE (classes préparatoires ... | |
| 23 | | (0,120) | | Deux vidéos, réalisées par notre équipe, pour approfondi... | |
| Sous-page 1 | |||
| 8 | | (1,1) | | Rubriques : | Pourquoi venir en prépa ? | | Les ... | |
| 22 | | (1,10) | | Des exemples d'emploi du temps Les emplois du temps des d... | |
| 7 | | (1,20) | | Mathématiques Le cours de mathématique s'articule aut... | |
| 9 | | (1,30) | | Physique et chimie Les grands domaines de la physique s... | |
| 10 | | (1,40) | | Sciences de l'ingénieur L'objectif des sciences de l'i... | |
| 11 | | (1,50) | | Informatique Les bases nécessaires à tout scientifiqu... | |
| 12 | | (1,60) | | Français-philosophie Le thème de l'année s'articule ... | |
| 13 | | (1,70) | | Langues vivantes LV1 au choix entre anglais, allemand e... | |
| 14 | | (1,80) | | TIPE Les travaux d'initiative personnelle encadrée (T... | |
| Sous-page 2 | |||
| 16 | | (2,1) | | Rubriques : | Pourquoi venir en prépa ? | | Les ... | |
| 15 | | (2,90) | | Les filières en général Il existe plusieurs CPGE s... | |
| 21 | | (2,110) | | Les filières aux lycée Follereau Le lycée Follerea... | |
| 24 | | (2,130) | | Une vidéo, réalisée par notre équipe, pour approfondir s... | |
| Sous-page 3 | |||
| 17 | | (3,1) | | Rubriques : | Pourquoi venir en prépa ? | | Les ... | |
| 18 | | (3,100) | | Les recommandations pour les spécialités En première... | |
Les atouts du lycée Follereau
| Sous-page 0 | |||
| 26 | | (0,1) | | Rubriques : | L'établissement | ← vous êtes ici ... | |
| 19 | | (0,10) | | Un cadre agréable Espaces verts, équipements sporti... | |
| 27 | | (0,15) | | Salles de classe et de TP. TP de phy... | |
| 25 | | (0,20) | | Une vidéo, réalisée par notre équipe, sur notre établis... | |
| Sous-page 1 | |||
| 29 | | (1,1) | | Rubriques : | L'établissement | | Spécificités... | |
| 28 | | (1,30) | | Des caractéristiques uniques à notre structure : De... | |
| Sous-page 2 | |||
| 30 | | (2,1) | | Rubriques : | L'établissement | | Spécificités... | |
| 33 | | (2,50) | | L'internat Des places réservées pour les deux anné... | |
| Sous-page 3 | |||
| 31 | | (3,40) | | Rubriques : | L'établissement | | Spécificités... | |
| 34 | | (3,60) | | Écoutez les étudiants en parler : ... | |
Et après la prépa ?
| Sous-page 0 | |||
| 20 | | (0,10) | | Poursuite d'étude Plus de 200 écoles d'ingénieurs ... | |
| 36 | | (0,20) | | Vers quels métiers ? Métiers d'ingénieur. Enseignem... | |
Calendrier rencontres et contact
| Sous-page 0 | |||
| 32 | | (0,10) | | Dates importantes pour l'orientation : Portes ouv... | |
| 35 | | (0,20) | | Pour contacter l'équipe de CPGE : mickael.melzani@ac-bes... | |
Liens
| Sous-page 0 | |||
| 3 | | (0,10) | | Nos formations sur parcoursup : Classe de PCSI. Clas... | |
Nouvelle page
Notes diverses
À faire : Exemples de parcours individuels : bulletin lycée (anonyme) puis école obtenue ?
Témoignages ?
Contre quelques idées reçues (cf sites collègues, plaquette UPSTI, UPS...).
Mode d'emploi HTML
Voici quelques exemples. Attention, une balise html est délimitée par des "<" et ">", que j'ai remplacé par des crochet "[" et "]" afin qu'ils s'affichent sans être interprétés. Aller voir dans le code pour voir les originaux fonctionner.Quelques balises HTML
Sauter une ligne : balise [br].Texte en gras : balise [b] ou balise [strong].
Italique : balise [i].
Pour faire une liste : balises [ul] et [li], exemple :
- élément 1
- élément 2
- élément 3
Les sauts de ligne avec br ne donnent pas des espacements très sympathiques. Il est préférable d'utiliser la balise [p] (pour paragraphe) qui sert à délimiter un paragraphe.
Le saut de ligne est alors automatique, comme on peut le voir dans cet exemple (cf le code, ce bloc de texte et le précédent sont délimités par [p]).
Une option permet de ne pas faire d'alinéa en début de paragraphe : [p class="noindent"]. On l'utilisera le plus possible sur le site, car du fait qu'on tape souvent des textes courts, mettre un alinéa fait un peu bizarre.
Pour les listes (ul et li), privilégier une syntaxe avec des [p class="noindent"] permet une aération plu ssympatique. Exemple :
élément 1
élément 2
élément 3
Les balises [h1], [h2], [h3], [h4] permettent de faire des titres. J'utilise surtout h4 sur le site, parfois h3. Cf les pages du sites pour des exemples.
Les commentaires sont [!--délimités par ces balises--]. Cf exemple dans le code.
Il existe plein d'autres balises (texte couleur, ...), ne pas hésiter à chercher sur le net. De plus, le site supporte les équations en latex : $\Delta U = W+Q+\dfrac{\pi^2}{6}$.
Fichiers et images
Quand on upload un fichier depuis son ordinateur vers le site (avec le formulaire de la page d'administration), le fichier se retrouve dans un des dossiers du site (le dossier qu'on a sélectionné).
Lors de l'upload, un message indique le numéro qui est attribué à ce fichier. Supposons que ce numéro soit le 1. Alors :
Pour générer un lien vers ce fichier, utiliser la balise [a href="downloads.php?id=1"]texte du lien[/a].
Par exemple : ceci est un lien vers le fichier de numéro 1 (qui se trouve être une image, mais peu importe).
Si le fichier est une image et qu'on souhaite l'afficher (et non pas en donner un lien), il faut utiliser la balise [img], avec par exemple : [img src="downloads.php?id=1" width="10%"], qui donne :
Pour la centrer, balise [center] :
Si on veut que l'image soit cliquable (cliquer dessus fait télécharger l'image), alors il faut imbriquer les deux balises : [a href="downloads.php?id=1"][img src="downloads.php?id=1" width="20%"][/a]
Balises div pour limiter la largeur
Les textes ci-dessus occupent un espace assez large (les lignes affichées à l'écran sont longues) et c'est un peu fatiguant à lire. Pour limiter l'extension des lignes, on englobe tout le code d'une "case" par des balises [div class="boite2"]. On essaie de le faire tout le temps, sauf exception (par exemple on peut laisser les titres, ou une grande image, en dehors de ces balises div). Comparer la largeur des lignes de cette case (qui est encadrée par des div class="boite2") et la largeur des cases précédentes : c'est différent.
En plus, cela justifie l'alignement à gauche du texte.
Attention, une telle balise div doit être refermée à la fin par [/div].
Balises div pour structure en colonne
Il est souvent utile d'avoir une colonne large à gauche pour le texte, et une petite à droite pour des images. Ceci se fait avec une délimitation par les balises :
[div class="boite2" style="display:inline-block;"] et [/div] pour la colonne de gauche
[div class="boite3" style="display:inline-block;"] et [/div] pour la colonne de droite.
le texte à droite, avec pour exemple une image cliquable.
Et on peut enchainer ainsi les colonnes en répétant ces blocs de code.
Un point important est que l'utilisation de ces balises div permet de s'adapter à l'écran. Sur smartphone, la mise en page change : la structure en deux colonnes passe à une structure en une seule colonne.