CSS Secrets

Index

Symbols

(pseudo)random backgrounds, 62-65

.avatar, 337-340, 343

.lightbox, 235

3D rotation, for trapezoids, 109-113

::backdrop, for dimming, 238

:nth-child() pseudo-class, 178, 271-275

:only-child, 272

<blink>, 314

<code> element, 182

<dd>, 173-177

<dialog>, 238

<div>, 252

<dt>, 173-177

<labels>, 229

<main>, 241

<path>, 211

<pre> element, 182

<span>, 189, 210

<textPath>, 211

@font-face, 189

(soft hyphens), 168

A

absolute positioning, for vertical centering, 281

acceleration, timing function and, 296-299

affordance, 225

align-items, vertical centering and, 286

ampersands, fancy, 188-193

Anderson, James, 280

animated GIFs, shortcomings of, 308

animation, 294-345

along a circular path, 334-345

blinking, 314-318

bouncing, 295-299

converting to transition, 301

duration vs. effectiveness, 321

elastic transitions, 294-305

for pie charts, 119-121

frame-by-frame, 308-312

smooth state, 328-332

typing, 320-326

animation-direction, 316, 339

animation-playstate, 332

animation-timing-function, 296

APNG, 309

assumptions, xxiv

Atlas system, xxii

automatic table layout algorithm, 266

B

background(s)

(pseudo)random, 62-65

and inner-rounded borders, 37

and zebra-striped lines, 180

checkerboards, 55-60

complex patterns, 50-60

diagonal stripes, 43-47

flexible positioning, 32-35

fluid with fixed content, 276-279

grids, 52

polka dots, 53

striped, 40-48

vertical stripes, 43

background-attachment, 246

background-blend mode, 141

background-clip, 26, 70, 225

background-image, text underlining and, ...