Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Couple of fixes + prez #9

Merged
merged 11 commits into from
Feb 29, 2016
Prev Previous commit
Next Next commit
Updates on style/CSS sections
DavidBruant committed Jan 21, 2016

Verified

This commit was signed with the committer’s verified signature.
snyk-bot Snyk bot
commit b506d0bd02abb79b14e53d140b33596ffda00d7d
21 changes: 8 additions & 13 deletions index.html
Original file line number Diff line number Diff line change
@@ -845,21 +845,21 @@ <h3>CSS</h3>

<section>
<h3>CSS</h3>
<p>Anatomie d'un élément :</p>
<p>Anatomie d'un élément (<em>box model</em>) :</p>
<img width="600" data-src="img/element_anatomy.png">
</section>

<section>
<h3>3 façons de définir un style :</h3>
<pre><code class="html" data-trim contenteditable>
// dans l'élément
<element style="..."></element>
// dans une stylesheet
<link rel="stylesheet" href="main.css">

// dans un bloc style
<style type="text/css"></style>

// dans une stylesheet
<link rel="stylesheet" href="main.css">
// dans l'élément
<element style="..."></element>
</code></pre>
</section>

@@ -884,8 +884,8 @@ <h3>Exemples de sélécteurs d'attributs :</h3>
div p a {...}
div.maClasse {...}
div a#monId {...}
ul > li {...} // all li directly child from ul
div[class=”maClasse”] {...} // all div that have only this class
ul > li {...} // all li directly children of ul
div[class=”maClasse”] {...} // all div that only have this class
div + span {...} // span that is adjacent to div
a[class~=”plop”] {...} // all div that have at least this class
</code></pre>
@@ -917,14 +917,9 @@ <h3>Pseudo-éléments</h3>
</code></pre>
</section>

<section>
<h3>Poids des sélécteurs</h3>
</section>

<section>
<h3>display</h3>
<p>By default, block takes all the width it can independent of the content, whereas an inline will have a width that depend on the content.

<p>By default, <strong>block</strong> takes all the width it can independent of the content, whereas an <strong>inline</strong> will have a width that depend on the content.
inline-block has both property.</p>
</section>