JS-in-CSS

Intro

Remember me?

CSS is awesome

Stylesheet editor

Editing CSS

CSS custom properties: variables

Reload page when done.
CSS custom properties

if(): conditional statements

CSS if() function

HTML for :target deck

<article id="slideID">
  <header>
    <h1>Page title</h1>
  </header>
  <figure>
    Contents of page (often and <object>)
  </figure>
</article>
<a href="#slideID" checked><span>Accessible name</span></a>
HTML for deck

CSS of :target slide deck explained

CSS of deck explained

The actual <style>

Slide deck's actual CSS Outro Resources