bootstrapwrapper

Différences

Ci-dessous, les différences entre deux révisions de la page.

Lien vers cette vue comparative

Les deux révisions précédentes Révision précédente
Prochaine révision
Révision précédente
Dernière révisionLes deux révisions suivantes
bootstrapwrapper [2021/01/26 16:33] villersdbootstrapwrapper [2021/05/26 02:53] – [Hello, world!] villersd
Ligne 18: Ligne 18:
 <panel title="Second panel"> <panel title="Second panel">
 Second panel content Second panel content
- 
 <btn type="success" size="lg" icon="glyphicon glyphicon-edit">[[:playground:playground]]</btn> <btn type="success" size="lg" icon="glyphicon glyphicon-edit">[[:playground:playground]]</btn>
 </panel> </panel>
 </accordion> </accordion>
 +
 +=== Application à des QCM ===
 +
 +<callout type="question" icon="true">
 +Des masses égales de dioxygène et de dihydrogène réagissent dans un récipient fermé, conduisant à la formation d'eau. Après réaction complète, que contiendra le récipient ?
 +</callout>
 +
 +<accordion collapsed="true">
 +<panel type="default"  no-body="true">
 +<panel-body></panel-body>
 +Sélectionnez une des propositions suivantes !
 +</panel>   
 +<panel type="default" title="1. de l'eau et du dioxygène seulement">
 +Faux. Il faut raisonner en terme de quantités de matière !
 +</panel>    
 +<panel type="default" title="2. de l'eau et du dihydrogène seulement">
 +Vrai. Il faut raisonner en terme de quantités de matière et le dihydrogène, très léger, est manifestement en excès. Le dioxygène est donc le réactif limitant, complètement consommé!
 +</panel>    
 +<panel type="default" title="3. de l'eau seulement">
 +Faux. Il faut raisonner en terme de quantités de matière et de stœchiométrie. Les réactifs ne sont pas en quantités correspondant à la stœechiométrie de la réaction !
 +</panel>    
 +<panel type="default" title="4. de l'eau, du dihydrogène et du dioxygène">
 +Faux. Si la réaction est complète ce n'est pas possible qu'il subsiste à la fois les deux réactifs!
 +</panel>    
 +</accordion>
 +
 +=== Table des matières d'un livre ===
  
 <accordion> <accordion>
Ligne 81: Ligne 107:
 **Well done!** You successfully read this important alert message. **Well done!** You successfully read this important alert message.
 </alert> </alert>
 +
 +<alert type="success" dismiss="true" icon="fa fa-check-circle fa-3x fa-pull-right">C'est correct !</alert>
 +
 +<alert type="danger" dismiss="true" icon="fa fa-times-circle fa-3x fa-pull-right">Ce n'est pas correct !</alert>
  
 <alert type="warning" dismiss="true" icon="fa fa-warning">**Warning!** Better check yourself, you're not looking too good.</alert> <alert type="warning" dismiss="true" icon="fa fa-warning">**Warning!** Better check yourself, you're not looking too good.</alert>
Ligne 125: Ligne 155:
     * [[https://commons.wikimedia.org/wiki/File:Metacognition.jpg]]     * [[https://commons.wikimedia.org/wiki/File:Metacognition.jpg]]
  
-<carousel>+ 
 +<carousel  interval="false"> 
 +<slide> 
 +{{https://upload.wikimedia.org/wikipedia/commons/thumb/4/4a/GHS-pictogram-explos.svg/600px-GHS-pictogram-explos.svg.png}} 
 +</slide> 
 +<slide> 
 +{{https://upload.wikimedia.org/wikipedia/commons/thumb/6/6d/GHS-pictogram-flamme.svg/600px-GHS-pictogram-flamme.svg.png}} 
 +<caption> 
 +Description 
 +</caption> 
 +</slide> 
 +<slide> 
 +{{https://upload.wikimedia.org/wikipedia/commons/thumb/e/e5/GHS-pictogram-rondflam.svg/600px-GHS-pictogram-rondflam.svg.png}} 
 +<caption> 
 +</caption> 
 +</slide> 
 +<slide> 
 +{{https://upload.wikimedia.org/wikipedia/commons/thumb/6/6a/GHS-pictogram-bottle.svg/600px-GHS-pictogram-bottle.svg.png}} 
 +<caption> 
 +</caption> 
 +</slide> 
 +<slide> 
 +{{https://upload.wikimedia.org/wikipedia/commons/thumb/a/a1/GHS-pictogram-acid.svg/600px-GHS-pictogram-acid.svg.png}} 
 +<caption> 
 +</caption> 
 +</slide> 
 +<slide> 
 +{{https://upload.wikimedia.org/wikipedia/commons/thumb/5/58/GHS-pictogram-skull.svg/600px-GHS-pictogram-skull.svg.png}} 
 +<caption> 
 +</caption> 
 +</slide> 
 +<slide> 
 +{{https://upload.wikimedia.org/wikipedia/commons/thumb/c/c3/GHS-pictogram-exclam.svg/600px-GHS-pictogram-exclam.svg.png}} 
 +<caption> 
 +</caption> 
 +</slide> 
 +<slide> 
 +{{https://upload.wikimedia.org/wikipedia/commons/thumb/2/21/GHS-pictogram-silhouette.svg/600px-GHS-pictogram-silhouette.svg.png}} 
 +<caption> 
 +</caption> 
 +</slide> 
 +<slide> 
 +{{https://upload.wikimedia.org/wikipedia/commons/thumb/a/a1/GHS-pictogram-acid.svg/600px-GHS-pictogram-acid.svg.png}} 
 +<caption> 
 +</caption> 
 +</slide> 
 +<slide> 
 +{{https://upload.wikimedia.org/wikipedia/commons/thumb/b/b9/GHS-pictogram-pollu.svg/600px-GHS-pictogram-pollu.svg.png}} 
 +<caption> 
 +</caption> 
 +</slide> 
 +</carousel> 
 + 
 +  * autre carousel... : 
 + 
 +<carousel interval="false">
 <slide> <slide>
 {{https://3starlearningexperiences.files.wordpress.com/2020/09/xyz1.png?nolink|}} {{https://3starlearningexperiences.files.wordpress.com/2020/09/xyz1.png?nolink|}}
Ligne 149: Ligne 234:
 </carousel> </carousel>
  
 +
 +==== Collapse ====
 +Quel est le nombre d'oxydation du manganèse dans l'ion permanganate ?
 +
 +<button collapse="foo">Cliquez ici</button>
 + 
 +<collapse id="foo" collapsed="true"><well>
 ++7
 +
 +L'ion permanganate <chem>(MnO4)-</chem> est une espèce chimique à géométrie tétraédrique caractérisée par un atome de manganèse central lié à quatre atomes d'oxygène et portant une charge globale équivalente à un électron (-1). Chaque atome d'oxygène possède le nombre d'oxydation -2, donc si x est le n.o. recherché pour l'atome de manganèse, on a x + 4 * -2 = -1
 +
 +Le manganèse est donc à l'état d'oxydation +7, ce qui fait que l'ion permanganate(VII) est un agent oxydant puissant, puisque tout les autres composés du manganèse ont un nombre d'oxydation inférieur.
 +</well></collapse>
  
 ==== Grids ==== ==== Grids ====
Ligne 165: Ligne 263:
  
 <jumbotron> <jumbotron>
-===== Hello, world! =====+Hello, world !
  
 This is a simple hero unit, a simple jumbotron-style  This is a simple hero unit, a simple jumbotron-style