CSS Action 2.book

Index
A
A List Apart, rubrique CSS 256
a, sélecteur 4
absolu, positionnement 50
spécification 52
absolues, unités de longueur 62
accessibilité, problèmes de 65
:active, pseudo-classe 283
Adobe Dreamweaver 54
:after, pseudo-élément 236, 283
Ajax, vue d’ensemble 153
Alexander, Levin 100
all, type de média 40
angles arrondis
avec JavaScript 123–127
sur des colonnes de largeur
fixe 113
variable 116
technique des sommets montagneux 120–
123
approche 78
archives des navigateurs, site web 250
astérisque HTML, astuce 241
astuces 239–253
attribut, sélecteurs de 15, 282
aural, type de média 40
B
Babble List 257
background, propriété 176
abrégée 46
CSS 2.1 264
background-attachment, propriété 92, 264
spécification 94
background-color, propriété 264
background-image, propriété 85, 96, 264
background-position, propriété 87, 264
spécification 89
background-position-x, extension de CSS 2.1
propre à Microsoft 275
background-position-y, extension de CSS 2.1
propre à Microsoft 275
background-repeat, propriété 85, 264
bande dessinée, aspect 137
:before, pseudo-élément 283
BlueRobot.com Layout Reservoir 256
bogues
de la marge flottante doublée 161
bogues et problèmes des navigateurs 247
Bonjour tout le monde !, exemple 1
Boodman, Aaron 105
Boot Camp, logiciel d’Apple 249
border, propriété 81, 174, 265
abrégée 46
border-bottom, propriété 265
abrégée 46
border-bottom-color, propriété 265
border-bottom-style, propriété 265
border-bottom-width, propriété 265
border-collapse, propriété 229, 264
border-color, propriété 23, 264
border-left, propriété 265
abrégée 46
border-left-color, propriété 265
border-left-style, propriété 265
border-left-width, propriété 265
border-right, propriété 265
abrégée 46
border-right-color, propriété 265
296
border-right-style, propriété 265
border-right-width, propriété 265
border-spacing, propriété 264
border-style, propriété 23, 265
border-top, propriété 265
abrégée 46
border-top-color, propriété 265
border-top-style, propriété 265
border-top-width, propriété 265
border-width, propriété 265
bordures
modèle de boîte et 24
par défaut des images, retirer 83
placer autour d’une image 81
bottom, propriété 266
bouton d’envoi, resemblant à du texte
HTML 205
Bowman, Doug 44
Bowman, Douglas 116
braille, type de média 40
Brain Jar, modèle de boîte 30
BrowserCam, service de capture d’écran 250,
259
Butter, Richard 68
C
caption, élément, sélecteur de 223
caption-side, propriété 266
caractères spéciaux
équivalents hexadécimaux 238
insérer avant les liens lors de
l’impression 237
Cederholm, Dan 120, 166, 257
Clarke, Andy 48
class, attribut 186
classe, sélecteurs de 9, 19–22, 282
spécification 22
clear, propriété 266
clip, propriété 266
colonnes
affichées dans un ordre quelconque 154–
170
de largeur fixe 113
fausses 166
color, propriété 266
Comic Sans MS 138
commentaires 41
conditionnels 244
spécification 42
Community MX’s Basics of CSS Positioning 255
composition en sommaire 71
appariée 72
content, propriété 266
contraste, vérifier le taux suffisant 170
couleur d’arrière-plan, modifier 229
Index
counter-increment, propriété 266
counter-reset, propriété 266
crénage 78
CSS
introduction 255
prise en charge par les navigateurs,
tableaux 258
propriétés 22
site officiel 259
CSS 2.1
extensions propriétaires 275–280
Microsoft 275–277
Mozilla 278–280
propriétés 263
background 264
background-attachment 264
background-color 264
background-image 264
background-position 264
background-repeat 264
border 265
border-bottom 265
border-bottom-color 265
border-bottom-style 265
border-bottom-width 265
border-collapse 264
border-color 264
border-left 265
border-left-color 265
border-left-style 265
border-left-width 265
border-right 265
border-right-color 265
border-right-style 265
border-right-width 265
border-spacing 264
border-style 265
border-top 265
border-top-color 265
border-top-style 265
border-top-width 265
border-width 265
bottom 266
caption-side 266
clear 266
clip 266
color 266
content 266
counter-increment 266
counter-reset 266
cursor 267
direction 267
display 267
empty-cells 267
float 267
Index
font 268
font-family 267
font-size 268
font-style 268
font-variant 268
font-weight 268
height 268
left 269
letter-spacing 269
line-height 269
list-style 269
list-style-image 269
list-style-position 269
list-style-type 269
margin 270
margin-bottom 270
margin-left 270
margin-right 270
margin-top 270
max-height 270
max-width 271
min-height 271
min-width 271
orphans 271
outline 272
outline-color 271
outline-style 271
outline-width 271
overflow 272
padding 272
padding-bottom 272
padding-left 272
padding-right 272
padding-top 272
page-break-after 272
page-break-before 272
page-break-inside 272
position 272
quotes 273
right 273
table-layout 273
text-align 273
text-decoration 273
text-indent 273
text-transform 273
top 274
unicode-bidi 274
vertical-align 274
visibility 274
white-space 274
widows 274
width 274
word-spacing 274
z-index 274
spécifications 259
297
CSS Zen Garden 256
css-discuss 258
CSS-Edge 256
cursor, propriété CSS 2.1 267
D
Dave Shea’s Roadmap to Standards Essay 255
Davidson, Mike 103
Debian Linux et double amorçage 249
dépannage 239–253
descendant, sélecteurs de 12, 281
pour les styles 224
spécifications 193
Dhakar, Lokesh 151
diaporama 152
didacticiels
CSS pour les concepteurs 255
sur la propriété CSS float 256
sur le changement de style 48
sur les couleurs de liens multiples, site web
de Backstage 185
sur les pseudo-classes, site web de
W3Schools 185
sur les sélecteurs CSS 256
direction, propriété 267
display, propriété 267
spécification 228
DOCTYPE 228
attribuer 258
déclaration 31
Document Type Definition (DTD) 30, 228
E
Edwards, James 48
effets
bulles de texte 136–138
lightbox
ajouter 149
bibliothèques Prototype et
Scriptaculous 150
diaporama 152
surligner
des champs de formulaire 211
une ligne d’un tableau 232
éléments
de bloc, modèle de boîte et 24
de page 149–153
flottants
avec des images 48
modèle 157, 168
spécification 50
positionner 50, 53
em, unités 63, 65, 67
embossed, type de média 40
298
empty-cells, propriété CSS 2.1 267
émulateurs pour le test multi-plateforme des
conceptions 248
enfant, sélecteurs de 13, 282
espace
entre les lettres et les mots d’un texte HTML,
ajuster 77
entre un titre et un paragraphe, retirer 70
retirer 70
espacement, concept 26
extensions propriétaires de CSS 2.1 275–280
externes, styles 33
F
Fahrner, Todd 68, 99
Farhner Image Replacement (FIR), méthode 99
fausses colonnes 166
feuilles de style 36–41
de remplacement 47
et options 47
en cascade (voir CSS)
externes 44
organiser
le contenu 42
les fichiers 44
propriétés abrégées 45
règles de média 37
spécification 41
filter, extension de CSS 2.1 propre à
Microsoft 105, 275
:first-child, pseudo-classe 283
:first-letter, pseudo-élément 283
:first-line, pseudo-élément 283
fixe (ou absolu), type de mesures 64
Flash, pour remplacer du texte HTML 101
float, propriété 159, 209, 267
:focus, pseudo-classe 283
font, propriété 268
abrégée 46
font-family, propriété CSS 2.1 267
font-size, propriété 62
CSS 2.1 268
spécification 64
font-style, propriété CSS 2.1 268
font-variant, propriété CSS 2.1 268
font-weight, propriété 23
CSS 2.1 268
formulaires 199–221
bouton d’envoi ressemblant à du texte
HTML 205
champ de rechercher à la Mac 201
éléments de saisie, appliquer des styles
différents à 200
intégrer un retour d’informations 212
didacticiel 214
Index
lien HTML textuel servant de bouton
d’envoi 206
modifier l’espace autour 199
passer de une à deux colonnes 207
raccourcis clavier, créer des indicateurs
visuels pour 214
regrouper des éléments communs 215
saisir des données dans un tableur 218–221
surligner des champs 211
frère adjacent, sélecteurs de 15, 282
Fulciniti, Alessandro 123
G
gestion de CSS 42
Ghaste, Amit 48
GIF d’un seul pixel transparent 139
Gilder/Levin, technique de remplacement par
une image 74, 75, 98
Glish.com, techniques de mises en pages
CSS 256
gouttière 163
groupes de discussion 257
H
h1, sélecteur 4
handheld, type de média 41
handheld.css 36
height, propriété 268
Holzschlag, Molly 247
:hover, pseudo-classe 82, 233, 283
HTML 4.01
Recommandations 259
spécification de la DTD 32
types de document 30
HTML Dog CSS Properties, site web 24
HTML, utiliser CSS avec 2–5
I
iCapture 260
icônes, pour économiser de la bande
passante 144–146
identifiant, sélecteurs de 12, 19–22, 282
spécification 22
identifiants de fragments 195
images 81–146
angles arrondis
avec JavaScript 123–127
colonnes de taille fixe 113
colonnes de taille variable 116
technique des sommets
montagneux 120–123
bordure, placer autour 81
bulles de texte 136–138
combiner différents formats dans une
présentation 108
Index
d’arrière-plan
en mosaïque 86
figées 92
fixer 85
multiples 89
positionner sur la page web 86
répéter 86
éléments flottants et 48
GIF et JPEG, combiner 108
icônes 144–146
insérer des reflets 141–144
ombres portées derrière 127
adoucir 130
présentation panoramique 105
protéger 139–141
redimensionnables 133
supprimer les bordures par défaut 83
texte HTML
au-dessus 94
remplacé par 96
transparence alpha 103
ime-mode, extension de CSS 2.1 propre à
Microsoft 275
impression 235–238
indentation 71
info-bulles 194
Inman, Shaun 102, 169
Insert Title Web Design 251
Internet Explorer 5.x, réserver des styles
pour 240–243
Internet Explorer pour Windows
exécuter plusieurs versions 250
utiliser les commentaires conditionnels
pour les styles 244
J
JPEG et GIF, combiner 108
K
Knoppix, navigateur 249
L
:lang, pseudo-classe 283
layout-grid, extension de CSS 2.1 propre à
Microsoft 275
layout-grid-char, extension de CSS 2.1 propre à
Microsoft 275
layout-grid-line, extension de CSS 2.1 propre à
Microsoft 275
layout-grid-mode, extension de CSS 2.1 propre à
Microsoft 275
layout-grid-type, extension de CSS 2.1 propre à
Microsoft 275
left, propriété 269
299
légendes
spécifier 224
styler 223
letter-spacing, propriété 77, 78, 269
spécification 79
liens
changer la couleur 183
dans différents sections d’une page 184
et navigation 183–198
icônes placées à la fin 185
identifiants de fragments 195
info-bulles 194
opérant comme des boutons d’envoi 206
line-break, extension de CSS 2.1 propre à
Microsoft 275
line-height, propriété CSS 2.1 269
:link, pseudo-classe 283
Linux, test des navigateurs 249
listes 173–180
grandes images comme marqueurs 176
présentation élaborée avec des images 178
séparateurs entre les éléments 174
list-style, propriété 176, 269
abrégée 46
list-style-image, propriété 269
list-style-position, propriété 269
list-style-type, propriété 269
Luminosity Contrast Ratio Analyser 170
Lynx, navigateur 253
Lynx Viewer, émulateur en ligne 252
M
Macintosh, test des navigateurs 249
marges, modèle de boîte et 24
margin, propriété 270
abrégée 47
margin-bottom, propriété 270
margin-left, propriété 175, 270
margin-right, propriété 270
margin-top, propriété 270
marquer et chercher des règles dans les fichiers
CSS 44
max-height, propriété 270
max-width, propriété 271
spécification 108
McLellan, Drew 103
menus
contextuels 191
rétractables 189–191, 198
Meyer, Eric A. 68, 256, 258
microformats 257
Microsoft
barre d’outils Image 140
Expression Web Designer 58
300
Microsoft (suite)
extensions propriétaires 275–277
background-position-x 275
background-position-y 275
filter 275
ime-mode 275
layout-grid 275
layout-grid-char 275
layout-grid-line 275
layout-grid-mode 275
layout-grid-type 275
line-break 275
overflow-x 275
overflow-y 275
scrollbar-3dlight-color 276
scrollbar-arrow-color 276
scrollbar-base-color 276
scrollbar-darkshadow-color 276
scrollbar-face-color 276
scrollbar-highlight-color 276
scrollbar-shadow-color 276
text-autospace 276
text-justify 277
text-kashida-space 277
text-underline-position 277
word-break 277
word-wrap 277
writing-mode 277
zoom 277
min-height, propriété CSS 2.1 271
min-width, propriété CSS 2.1 271
mises en pages
algorithme 166
colonnes affichées dans un ordre
quelconque (éléments
flottants) 154–170
éléments flottants, modèle 157, 168
gouttière 163
mode approximatif des navigateurs 31
modèle de boîte 24–30, 241
astuce 243
Brain Jar 30
modèle de boîte CSS interactif, site web 30
-moz-appearance, extension de CSS 2.1 propre à
Mozilla 278
-moz-background-clip, extension de CSS 2.1
propre à Mozilla 278
-moz-background-inline-policy, extension de
CSS 2.1 propre à Mozilla 278
-moz-background-origin, extension de CSS 2.1
propre à Mozilla 278
-moz-binding, extension de CSS 2.1 propre à
Mozilla 278
-moz-border-bottom-colors, extension de CSS 2.1
propre à Mozilla 278
Index
-moz-border-left-colors, extension de CSS 2.1
propre à Mozilla 278
-moz-border-radius, extension de CSS 2.1 propre
à Mozilla 278
-moz-border-radius-bottomleft, extension de
CSS 2.1 propre à Mozilla 278
-moz-border-radius-bottomright, extension de
CSS 2.1 propre à Mozilla 278
-moz-border-radius-topleft, extension de CSS 2.1
propre à Mozilla 278
-moz-border-radius-topright, extension de CSS
2.1 propre à Mozilla 278
-moz-border-right-colors, extension de CSS 2.1
propre à Mozilla 278
-moz-border-top-colors, extension de CSS 2.1
propre à Mozilla 278
-moz-box-align, extension de CSS 2.1 propre à
Mozilla 279
-moz-box-direction, extension de CSS 2.1 propre
à Mozilla 279
-moz-box-flex, extension de CSS 2.1 propre à
Mozilla 279
-moz-box-orient, extension de CSS 2.1 propre à
Mozilla 279
-moz-box-pack, extension de CSS 2.1 propre à
Mozilla 279
-moz-box-sizing, extension de CSS 2.1 propre à
Mozilla 279
Mozilla
extension Web Developer 260
extensions propriétaires 278–280
-moz-appearance 278
-moz-background-clip 278
-moz-background-inline-policy 278
-moz-background-origin 278
-moz-binding 278
-moz-border-bottom-colors 278
-moz-border-left-colors 278
-moz-border-radius 278
-moz-border-radius-bottomleft 278
-moz-border-radius-bottomright 278
-moz-border-radius-topleft 278
-moz-border-radius-topright 278
-moz-border-right-colors 278
-moz-border-top-colors 278
-moz-box-align 279
-moz-box-direction 279
-moz-box-flex 279
-moz-box-orient 279
-moz-box-pack 279
-moz-box-sizing 279
-moz-image-region 279
-moz-opacity 280
-moz-outline 280
-moz-outline-color 280
Index
-moz-outline-offset 280
-moz-outline-radius 280
-moz-outline-radius-bottomleft 280
-moz-outline-radius-bottomright 280
-moz-outline-radius-topleft 280
-moz-outline-radius-topright 280
-moz-outline-style 280
-moz-image-region, extension de CSS 2.1 propre
à Mozilla 279
-moz-opacity, extension de CSS 2.1 propre à
Mozilla 280
-moz-outline, extension de CSS 2.1 propre à
Mozilla 280
-moz-outline-color, extension de CSS 2.1 propre
à Mozilla 280
-moz-outline-offset, extension de CSS 2.1 propre
à Mozilla 280
-moz-outline-radius, extension de CSS 2.1 propre
à Mozilla 280
-moz-outline-radius-bottomleft, extension de
CSS 2.1 propre à Mozilla 280
-moz-outline-radius-bottomright, extension de
CSS 2.1 propre à Mozilla 280
-moz-outline-radius-topleft, extension de CSS 2.1
propre à Mozilla 280
-moz-outline-radius-topright, extension de CSS
2.1 propre à Mozilla 280
-moz-outline-style, extension de CSS 2.1 propre à
Mozilla 280
N
navigation
et liens 183–198
menus
avec des raccourcis clavier 187–189
contextuels 191
rétractables 189–191, 198
Newhouse, Mark 257
Nielsen, Jakob 183
Nifty Corners Cube, solution pour angles
arrondis 123–127
mots-clés
all (par défaut) 127
bl 126
bottom 126
br 126
left 127
right 127
tl 126
top 126
tr 126
:not, pseudo-classe 196
nth-child, sélecteur de pseudo-classe,
spécification 232
301
O
ombre
derrière du texte, placer 75
derrière une image 127
adoucir 130
orphans, propriété 271
outils 259
outline, propriété 272
outline-color, propriété 271
outline-style, propriété 271
outline-width, propriété 271
overflow, propriété 272
overflow-x, extension de CSS 2.1 propre à
Microsoft 275
overflow-y, extension de CSS 2.1 propre à
Microsoft 275
P
p, sélecteur 4
padding, propriété 272
abrégée 47
padding-bottom, propriété 272
padding-left, propriété 175, 272
padding-right, propriété 272
padding-top, propriété 272
page-break-after, propriété 272
page-break-before, propriété 272
page-break-inside, propriété 272
Pedrick, Chris 260
Phark, méthode de remplacement par une
image 100
pixels 63
maîtriser la typographie sur les plates-formes
et navigateurs 64
placeholder, attribut 202
PNG, transparencer alpha et 103
polices, spécifier les mesures et taille 62
portes coulissantes, technique 116
position, propriété 272
présentation
panoramique des images 105
visuelle versus structure 61
print, type de média 41
print.css 36
projection, type de média 41
projection.css 37
propriétés 22
abrégées 45
background 46
border 46
border-bottom 46
border-left 46
border-right 46
border-top 46
302
propriétés abrégées (suite)
font 46
list-style 46
margin 47
padding 47
spécification 47
CSS 2.1 (voir CSS 2.1, propriétés)
protéger les images contre le vol 139–141
Prototype, bibliothèque JavaScript 149
vue d’ensemble 153
pseudo-classes 17
:active 283
dynamiques, spécification 184
:first-child 283
:focus 283
:hover 283
:lang 283
:link 283
:visited 283
pseudo-éléments 18
:after 283
:before 283
:first-letter 283
:first-line 283
Q
quirk mode 31
quotes, propriété 273
R
raccourcis clavier 187–189, 214
spécification 189
Real World Style 257
redimensionnables, images 133
références 258
reflets ajoutés à des images 141–144
règles de média dans la même feuilles de style 37
regoupement de sélecteurs 282
relatif, positionnement 53
spécification 54
relatives, unités de longueurs 63
remplacement par une image, spécification 100
ressources 255–261
conception 256
générales sur HTML et CSS 255
groupes de discussion 257
HTML 255
outils 259
pour la conception 256
références 258
rétractables, menus 189–191
right, propriété 273
Robinson, Alex 157
Rundle, Mike 99
Rutter, Richard 67
Index
S
Safari, navigateur, champ de recherche 201
Scalable Inman Flash Replacement (sIFR),
technique 101
Schmitt, Christopher 257
screen, type de média 41
screen.css 36
Scriptaculous Effects, bibliothèque
JavaScript 149
scrollbar-3dlight-color, extension de CSS 2.1
propre à Microsoft 276
scrollbar-arrow-color, extension de CSS 2.1
propre à Microsoft 276
scrollbar-base-color, extension de CSS 2.1 propre
à Microsoft 276
scrollbar-darkshadow-color, extension de CSS
2.1 propre à Microsoft 276
scrollbar-face-color, extension de CSS 2.1 propre
à Microsoft 276
scrollbar-highlight-color, extension de CSS 2.1
propre à Microsoft 276
scrollbar-shadow-color, extension de CSS 2.1
propre à Microsoft 276
sélecteurs
contextuels pour les styles 224
d’attribut 15, 282
de classe 9, 19–22, 282
de descendant 12, 281
de frère adjacent 15, 282
de type 7, 281
d’enfant 13, 282
d’identifiant 12, 19–22, 282
regroupement 282
Selectutorial 19
spécification 19
universels 14, 281
utiliser pour appliquer des styles 5–19
westciv, site web 19
SelectORacle 260
Selectutorial 19
Shea, Dave 187
SimpleQuizes 257
Sleight, script, transparence alpha et 105
solutions de rechange 239–253
span, balise 74
non sémantique 99
structure versus présentation visuelle 61
styles
associer à une page web 33
changer dynamiquement 194–198
en-ligne 33, 35, 36
externes 33
internes 33
Recommandations 36
superposer plusieurs images, spécification 91
système de gestion des astuces 246
Index
T
tableaux 223–233
couleur d’arrière-plan, modifier pour les
lignes 229
retirer les vides
entre les cellules 228
entre les images dans les cellules 226
style
dans les cellules, définir 224
de la légende 223
surligner une ligne 232
table-layout, propriété 273
tableur, saisie des données dans un
formulaire 218–221
taille de police
contrôler sur les navigateurs et systèmes
d’exploitation 64–68
fixer à zéro ou une valeur négative 63
mots-clés pour 65
spécifier 62
Tantek, astuce du modèle de boîte 243
:target, pseudo-classe 196
spécification 198
technique des sommets montagneux 120–123
tester un site avec un seul ordinateur 248
text-align, propriété 23, 69, 273
spécification 69, 70
text-autospace, extension de CSS 2.1 propre à
Microsoft 276
text-decoration, propriété 273
texte
aligner 69
centrer 68
justifier 69
texte HTML
au-dessus d’une image 94
remplacer
par du texte Flash 100
par une image 96
text-indent, propriété 72, 99, 273
spécification 73
text-justify, extension de CSS 2.1 propre à
Microsoft 277
text-kashida-space, extension de CSS 2.1 propre à
Microsoft 277
text-shadow, propriété 75
spécification 76
text-transform, propriété 273
text-underline-position, extension de CSS 2.1
propre à Microsoft 277
title, attribut, spécification 194
top, propriété CSS 2.1 274
transparence alpha 103
tty, type de média 41
303
tv, type de média 41
type, sélecteurs de 7, 281
spécification 226
types de document (DOCTYPE) 30–32
types de médias
all 40
aural 40
braille 40
embossed 40
handheld 41
print 41
projection 41
screen 41
tty 41
tv 41
Typetester 257
typographie web 61–79
U
unicode-bidi, propriété 274
unités de longueur
absolues 62
relatives 63
universels, sélecteurs 14, 281
URI (Uniform Resource Identifier), afficher lors
de l’impression 236
Usenet, groupes de discussion sur les feuilles de
style 258
utilisabilité 183
problèmes de 65
V
vertical-align, propriété 274
Virtual PC pour Mac 249
visibility, propriété 274
:visited, pseudo-classe 283
VMWare Workstation 249
W
W3C
DTD recommandées 258
liste de diffusion 258
page pour CSS 259
tableau de toutes propriétés 24
validateurs 32, 260
HTML 260
white-space, propriété 274
widows, propriété 274
width, propriété 274
Wine, implémentation Open Source de l’API
Windows 249
word-break, extension de CSS 2.1 propre à
Microsoft 277
304
word-spacing, propriété 78, 274
spécification 79
word-wrap, extension de CSS 2.1 propre à
Microsoft 277
writing-mode, extension de CSS 2.1 propre à
Microsoft 277
www-style, liste de diffusion du W3C 258
X
x-height (ex), unités 63
Index
XHTML 30
XHTML 1.0, spécifications 259
Xyle Scope 260
Z
z-index, propriété 274
zoom, extension de CSS 2.1 propre à
Microsoft 277