Slides verticaux, image en background sur un slide, fragmentation...
This commit is contained in:
parent
1be3a6fd5f
commit
c8410de67c
|
@ -1,5 +1,48 @@
|
|||
# Howto reveal.js
|
||||
|
||||
Pour faire des slides verticaux, il suffit d'englober plusieurs sections dans une même section :
|
||||
|
||||
~~~{.html}
|
||||
<section>
|
||||
<section>
|
||||
<h2>Vertical Slides</h2>
|
||||
<p>
|
||||
Slides can be nested inside of each other.
|
||||
</p>
|
||||
</section>
|
||||
<section>
|
||||
<h2>Basement Level 1</h2>
|
||||
<p>
|
||||
Nested slides are useful for adding additional detail underneath a high level horizontal slide.
|
||||
</p>
|
||||
</section>
|
||||
</section>
|
||||
~~~
|
||||
|
||||
Pour intégrer une image en background sur un slide en particulier, il faut ajouter l'attribut data-background à la section :
|
||||
|
||||
~~~{.html}
|
||||
<section data-background="url-de-l-image.png">
|
||||
<h2>A slide with a image</h2>
|
||||
<p>
|
||||
Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.
|
||||
</p>
|
||||
</section>
|
||||
~~~
|
||||
|
||||
On peut afficher du texte ou des images de façon fragmentée grâce à la class "fragment" :
|
||||
|
||||
~~~{.html}
|
||||
<section>
|
||||
<h2>A slide with a image</h2>
|
||||
<p class="fragment">Lorem ipsum dolor sit amet...</p>
|
||||
<p class="fragment"> ...consectetur adipiscing elit...</p>
|
||||
<p class="fragment">...sed do eiusmod tempor incididunt ut...</p>
|
||||
</p>...labore et dolore magna aliqua.</p>
|
||||
<img class="fragment" data-src="url-de-l-image.png">
|
||||
</section>
|
||||
~~~
|
||||
|
||||
Transformer une présentation en .pdf :
|
||||
|
||||
~~~
|
||||
|
|
Loading…
Reference in a new issue