Tableau avec en-têtes fixes
Faire défiler un tableau sans les en-têtes.
Lorsqu'il s'agit d'afficher un grand tableau, le défilement de la page risque de faire disparaître les titres. Il sera alors difficile de se repérer entre les colonnes. Nous vous proposons ici quelques lignes de CSS pour formater le tableau, mais surtout pour permettre le défilement de la partie centrale uniquement. Autrement dit pour afficher le tableau comme ci-dessous.
Première solution.
Le principe est de fixer la hauteur du corps du tableau (tbody) en rendant invisible le contenu au delà de cette hauteur.
Pour que cela fonctionne il faut changer le type d'affichage en block
de toutes les sections du tableau.
Pour l'esthétique, nous avons ajouté un coloriage une ligne sur deux.
Principales propriétés de CSS | ||
---|---|---|
Propriétés | Statut | Utilisable en |
-moz-border-end | D | [HTML] |
-moz-border-start | D | [HTML] |
-moz-float-edge | D | [HTML] |
-moz-force-broken-image-icon | D | [HTML] |
-moz-image-region | D | [HTML] |
-webkit-font-smoothing | D | [HTML] |
-webkit-tap-highlight-color | D | [HTML] |
-webkit-text-stroke | D | [HTML] |
accent-color | S | [HTML] |
align-content | S | [HTML] |
align-items | S | [HTML] |
align-self | S | [HTML] |
alignment-baseline | S | [HTML], [SVG] |
all | S | [HTML] |
animation | S | [HTML] |
animation-composition | S | [HTML] |
animation-delay | S | [HTML] |
animation-direction | S | [HTML] |
animation-duration | S | [HTML] |
animation-fill-mode | S | [HTML] |
animation-iteration-count | S | [HTML] |
animation-name | S | [HTML] |
animation-play-state | S | [HTML] |
animation-range | X | [HTML] |
animation-range-end | X | [HTML] |
animation-range-start | X | [HTML] |
animation-timeline | X | [HTML] |
animation-timing-function | S | [HTML] |
appearance | X | [HTML] |
aspect-ratio | S | [HTML] |
azimuth | D | [HTML] |
backdrop-filter | S | [HTML] |
backface-visibility | S | [HTML] |
background | S | [HTML] |
background-attachment | S | [HTML] |
background-blend-mode | S | [HTML] |
background-clip | S | [HTML] |
background-color | S | [HTML] |
background-image | S | [HTML] |
background-origin | S | [HTML] |
background-position | S | [HTML] |
background-position-x | S | [HTML] |
background-position-y | S | [HTML] |
background-repeat | S | [HTML] |
background-size | S | [HTML] |
baseline-shift | X | [HTML], [SVG] |
baseline-source | X | [HTML] |
bleed | X | [HTML] |
block-ellipsis | X | [HTML] |
block-size | S | [HTML] |
border | S | [HTML] |
border-block-color | S | [HTML], [SVG] |
border-block-end | S | [HTML], [SVG] |
border-block-end-color | S | [HTML], [SVG] |
border-block-end-style | S | [HTML], [SVG] |
border-block-end-width | S | [HTML], [SVG] |
border-block-start | S | [HTML], [SVG] |
border-block-start-color | S | [HTML], [SVG] |
border-block-start-style | S | [HTML], [SVG] |
border-block-start-width | S | [HTML], [SVG] |
border-block-style | S | [HTML], [SVG] |
border-block-width | S | [HTML], [SVG] |
border-bottom-left-radius | S | [HTML] |
border-bottom-right-radius | S | [HTML] |
border-collapse | S | [HTML] |
border-color | S | [HTML] |
border-end-end-radius | S | [HTML], [SVG] |
border-end-start-radius | S | [HTML], [SVG] |
border-image | S | [HTML] |
border-image-outset | S | [HTML] |
border-image-repeat | S | [HTML] |
border-image-slice | S | [HTML] |
border-image-source | S | [HTML] |
border-image-width | S | [HTML] |
border-inline-color | S | [HTML], [SVG] |
border-inline-end | S | [HTML], [SVG] |
border-inline-end-color | S | [HTML], [SVG] |
border-inline-end-style | S | [HTML], [SVG] |
border-inline-end-width | S | [HTML], [SVG] |
border-inline-start | S | [HTML], [SVG] |
border-inline-start-color | S | [HTML], [SVG] |
border-inline-start-style | S | [HTML], [SVG] |
border-inline-start-width | S | [HTML], [SVG] |
border-inline-style | S | [HTML], [SVG] |
border-inline-width | S | [HTML], [SVG] |
border-radius | S | [HTML] |
border-spacing | S | [HTML] |
border-start-end-radius | S | [HTML], [SVG] |
border-start-start-radius | S | [HTML], [SVG] |
border-style | S | [HTML] |
border-top-left-radius | S | [HTML] |
border-top-right-radius | S | [HTML] |
border-width | S | [HTML] |
bottom | S | [HTML] |
box-align | D | [HTML] |
box-decoration-break | S | [HTML] |
box-direction | D | [HTML] |
box-flex | D | [HTML] |
box-lines | D | [HTML] |
box-ordinal-group | D | [HTML] |
box-orient | D | [HTML] |
box-pack | D | [HTML] |
box-reflect | D | [HTML] |
box-shadow | S | [HTML] |
box-sizing | S | [HTML] |
break-after | S | [HTML] |
break-before | S | [HTML] |
break-inside | S | [HTML] |
caption-side | S | [HTML] |
caret | X | [HTML] |
caret-color | S | [HTML] |
caret-shape | X | [HTML] |
clear | S | [HTML] |
clip | D | [HTML], [SVG] |
clip-path | S | [HTML], [SVG] |
clip-rule | S | [HTML], [SVG] |
color | S | [HTML], [SVG] [1] |
color-adjust | D | [HTML] |
color-interpolation | S | [SVG] |
color-interpolation-filters | S | [SVG] |
column-count | S | [HTML] |
column-fill | S | [HTML] |
column-gap | S | [HTML] |
column-rule | S | [HTML] |
column-rule-color | S | [HTML] |
column-rule-style | S | [HTML] |
column-rule-width | S | [HTML] |
column-span | S | [HTML] |
column-width | S | [HTML] |
columns | S | [HTML] |
contain | S | [HTML] |
contain-intrinsic-block-size | S | [HTML] |
contain-intrinsic-height | S | [HTML] |
contain-intrinsic-inline-size | S | [HTML] |
contain-intrinsic-size | S | [HTML] |
contain-intrinsic-width | S | [HTML] |
container | S | [HTML] |
container-name | S | [HTML] |
container-type | S | [HTML] |
content | S | [HTML] |
content-visibility | S | [HTML] |
counter-increment | S | [HTML] |
counter-reset | S | [HTML] |
counter-set | S | [HTML] |
cue | X | [HTML] |
cue-after | X | [HTML] |
cue-before | X | [HTML] |
cursor | S | [HTML], [SVG] |
cx | S | [SVG] |
cy | S | [SVG] |
direction | S | [HTML], [SVG] |
display | S | [HTML], [SVG] [1] |
dominant-baseline | S | [HTML], [SVG] |
elevation | D | [HTML] |
empty-cells | S | [HTML] |
fill | X | [SVG] |
fill-color | X | [SVG] |
fill-opacity | S | [SVG] |
fill-rule | S | [SVG] |
filter | S | [HTML], [SVG] |
flex | S | [HTML] |
flex-basis | S | [HTML] |
flex-direction | S | [HTML] |
flex-flow | S | [HTML] |
flex-grow | S | [HTML] |
flex-shrink | S | [HTML] |
flex-wrap | S | [HTML] |
float | S | [HTML] |
float-defer | X | [HTML] |
float-offset | X | [HTML] |
float-reference | X | [HTML] |
flood-color | S | [SVG] |
flood-opacity | S | [SVG] |
flow-from | X | [HTML] |
flow-into | X | [HTML] |
font | S | [HTML], [SVG] |
font-effect | D | [HTML] |
font-family | S | [HTML], [SVG] |
font-feature-settings | X | [HTML] |
font-kerning | S | [HTML] |
font-language-override | X | [HTML] |
font-optical-sizing | X | [HTML] |
font-palette | S | [HTML] |
font-size | S | [HTML] |
font-size-adjust | S | [HTML], [SVG] |
font-smooth | D | [HTML] |
font-stretch | S | [HTML], [SVG] |
font-style | S | [HTML], [SVG] |
font-synthesis | S | [HTML] |
font-synthesis-position | X | [HTML] |
font-synthesis-small-caps | X | [HTML] |
font-synthesis-style | X | [HTML] |
font-synthesis-weight | X | [HTML] |
font-variant | S | [HTML], [SVG] |
font-variant-alternates | S | [HTML] |
font-variant-caps | S | [HTML] |
font-variant-east-asian | S | [HTML] |
font-variant-emoji | X | [HTML] |
font-variant-ligatures | S | [HTML] |
font-variant-numeric | S | [HTML] |
font-variant-position | S | [HTML] |
font-variation-settings | X | [HTML] |
font-weight | S | [HTML], [SVG] |
font-width | S | [HTML] |
forced-color-adjust | X | [HTML] |
gap | S | [HTML] |
glyph-orientation-vertical | D | [HTML], [SVG] |
grid | S | [HTML] |
grid-area | S | [HTML] |
grid-auto-columns | S | [HTML] |
grid-auto-flow | S | [HTML] |
grid-auto-rows | S | [HTML] |
grid-column | S | [HTML] |
grid-column-end | S | [HTML] |
grid-column-gap | S | [HTML] |
grid-column-start | S | [HTML] |
grid-gap | S | [HTML] |
grid-row | S | [HTML] |
grid-row-end | S | [HTML] |
grid-row-gap | S | [HTML] |
grid-row-start | S | [HTML] |
grid-template | S | [HTML] |
grid-template-areas | S | [HTML] |
grid-template-columns | S | [HTML] |
grid-template-rows | S | [HTML] |
hanging-punctuation | X | [HTML] |
height | S | [HTML], [SVG] |
hyphenate-character | S | [HTML] |
hyphenate-limit-chars | X | [HTML] |
hyphenate-limit-last | X | [HTML] |
hyphenate-limit-lines | X | [HTML] |
hyphenate-limit-zone | X | [HTML] |
hyphens | S | [HTML] |
image-orientation | S | [HTML] |
image-rendering | S | [HTML], [SVG] |
ime-mode | D | [HTML] |
initial-letter | X | [HTML] |
initial-letter-wrap | X | [HTML] |
inline-size | S | [HTML] |
inset | S | [HTML] |
inset-block | S | [HTML] |
inset-block-end | S | [HTML] |
inset-block-start | S | [HTML] |
inset-inline | S | [HTML] |
inset-inline-end | S | [HTML] |
inset-inline-start | S | [HTML] |
isolation | S | [HTML] |
justify-content | S | [HTML] |
justify-items | S | [HTML] |
justify-self | S | [HTML] |
left | S | [HTML] |
letter-spacing | S | [HTML], [SVG] |
lighting-color | S | [SVG] |
line-break | S | [HTML] |
line-height | S | [HTML] |
line-padding | X | [HTML] |
list-style | S | [HTML] |
list-style-image | S | [HTML] |
list-style-position | S | [HTML] |
list-style-type | S | [HTML] |
margin | S | [HTML] |
margin-block | S | [HTML] |
margin-block-end | S | [HTML] |
margin-block-start | S | [HTML] |
margin-bottom | S | [HTML] |
margin-inline | S | [HTML] |
margin-inline-end | S | [HTML] |
margin-inline-start | S | [HTML] |
margin-left | S | [HTML] |
margin-right | S | [HTML] |
margin-top | S | [HTML] |
margin-trim | X | [HTML] |
marker-end | S | [SVG] |
marker-mid | S | [SVG] |
marker-offset | D | [HTML] |
marker-side | X | [HTML] |
marker-start | S | [SVG] |
marks | X | [HTML] |
mask | S | [HTML], [SVG] |
mask-border | S | [HTML], [SVG] |
mask-border-mode | X | [HTML], [SVG] |
mask-border-outset | X | [HTML], [SVG] |
mask-border-repeat | X | [HTML], [SVG] |
mask-border-slice | X | [HTML], [SVG] |
mask-border-source | X | [HTML], [SVG] |
mask-border-width | X | [HTML], [SVG] |
mask-clip | S | [HTML], [SVG] |
mask-composite | S | [HTML], [SVG] |
mask-image | S | [HTML], [SVG] |
mask-mode | S | [HTML], [SVG] |
mask-origin | S | [HTML], [SVG] |
mask-position | S | [HTML], [SVG] |
mask-repeat | S | [HTML], [SVG] |
mask-size | S | [HTML], [SVG] |
max-block-size | S | [HTML] |
max-height | S | [HTML] |
max-inline-size | S | [HTML] |
max-width | S | [HTML] |
min-block-size | S | [HTML] |
min-height | S | [HTML] |
min-inline-size | S | [HTML] |
min-width | S | [HTML] |
mix-blend-mode | S | [HTML] |
object-fit | S | [HTML] |
object-position | S | [HTML] |
offset | S | [HTML], [SVG] |
offset-anchor | S | [HTML], [SVG] |
offset-distance | S | [HTML], [SVG] |
offset-path | S | [HTML], [SVG] |
offset-position | S | [HTML], [SVG] |
offset-rotate | S | [HTML], [SVG] |
opacity | S | [HTML], [SVG] |
order | S | [HTML] |
orphans | S | [HTML] |
outline | S | [HTML] |
outline-color | S | [HTML] |
outline-offset | S | [HTML] |
outline-style | S | [HTML] |
outline-width | S | [HTML] |
overflow | S | [HTML], [SVG] |
overflow-block | S | [HTML] |
overflow-clip-margin | S | [HTML] |
overflow-inline | S | [HTML] |
overflow-wrap | S | [HTML] |
overflow-x | S | [HTML] |
overflow-y | S | [HTML] |
padding | S | [HTML] |
padding-block | S | [HTML] |
padding-block-end | S | [HTML] |
padding-block-start | S | [HTML] |
padding-bottom | S | [HTML] |
padding-inline | S | [HTML] |
padding-inline-end | S | [HTML] |
padding-inline-start | S | [HTML] |
padding-left | S | [HTML] |
padding-right | S | [HTML] |
padding-top | S | [HTML] |
page-break-after | D | [HTML] |
page-break-before | D | [HTML] |
page-break-inside | D | [HTML] |
paint-order | S | [SVG] |
pause | X | [HTML] |
pause-after | X | [HTML] |
pause-before | X | [HTML] |
perspective | S | [HTML] |
perspective-origin | S | [HTML] |
pitch | D | [HTML] |
pitch-range | D | [HTML] |
place-content | S | [HTML] |
place-items | S | [HTML] |
place-self | S | [HTML] |
play-during | D | [HTML] |
pointer-events | S | [HTML], [SVG] |
position | S | [HTML] |
print-color-adjust | S | [HTML] |
quotes | S | [HTML] |
r | S | [SVG] |
resize | S | [HTML] |
rest | X | [HTML] |
rest-after | X | [HTML] |
rest-before | X | [HTML] |
richness | D | [HTML] |
right | S | [HTML] |
rotate | S | [HTML] |
row-gap | S | [HTML] |
ruby-align | X | [HTML] |
ruby-merge | X | [HTML] |
ruby-overhang | X | [HTML] |
ruby-position | X | [HTML] |
rx | S | [SVG] |
ry | S | [SVG] |
scale | S | [HTML] |
scroll-behavior | S | [HTML] |
scroll-margin | S | [HTML] |
scroll-padding | S | [HTML] |
scroll-snap-align | S | HTML |
scroll-snap-stop | S | [HTML] |
scroll-snap-type | S | {HTML} |
scroll-timeline | X | [HTML] |
scroll-timeline-axis | X | [HTML] |
scroll-timeline-name | X | [HTML] |
scrollbar-3dlight-color | D | [HTML] |
scrollbar-arrow-color | D | [HTML] |
scrollbar-base-color | D | [HTML] |
scrollbar-color | X | [HTML] |
scrollbar-darkshadow-colo | D | [HTML] |
scrollbar-face-color | D | [HTML] |
scrollbar-gutter | X | [HTML] |
scrollbar-highlight-color | D | [HTML] |
scrollbar-shadow-color | D | [HTML] |
scrollbar-track-color | D | [HTML] |
scrollbar-width | X | [HTML] |
shape-image-threshold | S | [HTML] |
shape-margin | S | [HTML] |
shape-outside | S | [HTML] |
shape-rendering | S | [SVG] |
size | S | [HTML] |
speak | X | [HTML] |
speak-as | X | [HTML] |
speak-header | D | [HTML] |
speak-numeral | D | [HTML] |
speak-punctuation | D | [HTML] |
speech-rate | D | [HTML] |
stress | D | [HTML] |
stroke | S | [SVG] |
stroke-color | X | [SVG] |
stroke-dash-corner | X | [SVG] |
stroke-dash-justify | X | [SVG] |
stroke-dasharray | S | [SVG] |
stroke-dashoffset | S | [SVG] |
stroke-linecap | S | [SVG] |
stroke-linejoin | S | [SVG] |
stroke-miterlimit | S | [SVG] |
stroke-opacity | S | [SVG] |
stroke-width | S | [SVG] |
tab-size | S | [HTML] |
table-layout | S | [HTML] |
text-align | S | [HTML] |
text-align-all | X | [HTML] |
text-align-last | S | [HTML] |
text-anchor | S | [SVG] |
text-autospace | X | [HTML] |
text-box-edge | X | [HTML] |
text-box-trim | X | [HTML] |
text-combine-upright | S | [HTML] |
text-decoration | S | [HTML], [SVG] [1] |
text-decoration-color | S | [HTML] |
text-decoration-line | S | [HTML], [SVG] |
text-decoration-skip | X | [HTML] |
text-decoration-skip-box | X | [HTML] |
text-decoration-skip-ink | X | [HTML], [SVG] |
text-decoration-skip-inset | X | [HTML] |
text-decoration-skip-self | X | [HTML] |
text-decoration-skip-spaces | X | [HTML] |
text-decoration-style | S | [HTML], [SVG] |
text-decoration-thickness | S | [HTML], [SVG] |
text-emphasis | S | [HTML], [SVG] |
text-emphasis-color | S | [HTML], [SVG] |
text-emphasis-position | S | [HTML], [SVG] |
text-emphasis-skip | X | [HTML] |
text-emphasis-style | S | [HTML], [SVG] |
text-group-align | X | [HTML] |
text-indent | S | [HTML] |
text-justify | X | [HTML] |
text-orientation | S | [HTML] |
text-overflow | S | [HTML] |
text-rendering | S | [HTML] [1], [SVG] |
text-shadow | S | [HTML], [SVG] |
text-size-adjust | X | [HTML] |
text-space-collapse | D | [HTML] |
text-space-trim | D | [HTML] |
text-spacing | X | [HTML] |
text-spacing-trim | X | [HTML] |
text-transform | S | [HTML], [SVG] |
text-underline-offset | S | [HTML], [SVG] |
text-underline-position | S | [HTML], [SVG] |
text-wrap | X | [HTML] |
timeline-scope | X | [HTML] |
top | S | [HTML] |
touch-action | S | [HTML] |
transform | S | [HTML], [SVG] |
transform-box | S | [HTML], [SVG] |
transform-origin | S | [HTML], [SVG] |
transform-style | S | [HTML] |
transition | S | [HTML] |
transition-behavior | S | [HTML] |
transition-delay | S | [HTML] |
transition-duration | S | [HTML] |
transition-property | S | [HTML] |
transition-timing-function | S | [HTML] |
translate | S | [HTML] |
unicode-bidi | S | [HTML], [SVG] |
user-select | S | [HTML] |
vector-effect | X | [SVG] |
vertical-align | S | [HTML] |
view-timeline | X | [HTML] |
view-timeline-axis | X | [HTML] |
view-timeline-inset | X | [HTML] |
view-timeline-name | X | [HTML] |
view-transition-name | S | [HTML] |
visibility | S | [HTML], [SVG] |
voice-balance | X | [HTML] |
voice-duration | X | [HTML] |
voice-family | X | [HTML] |
voice-pitch | X | [HTML] |
voice-range | X | [HTML] |
voice-rate | X | [HTML] |
voice-stress | X | [HTML] |
voice-volume | X | [HTML] |
volume | D | [HTML] |
white-space | S | [HTML] |
white-space-collapse | S | [HTML] |
white-space-trim | X | [HTML] |
widows | S | [HTML] |
width | S | [HTML], [SVG] |
will-change | S | [HTML] |
word-boundary-detection | X | [HTML] |
word-boundary-expansion | D | [HTML] |
word-break | S | [HTML] |
word-space-transform | X | [HTML] |
word-spacing | S | [HTML],[SVG] |
word-wrap | S | [HTML] |
wrap-after | X | [HTML] |
wrap-before | X | [HTML] |
wrap-inside | X | [HTML] |
writing-mode | S | [HTML], [SVG] |
x | S | [SVG] |
y | S | [SVG] |
z-index | S | [HTML] |
zoom | X | [HTML] | 510 propriétés listées |
Autre solution : sticky
.
Dans cette deuxième solution le corps du tableau conserve sa hauteur complète
mais les titres (section thead) sont en position sticky
,
ce qui veut dire qu'ils défileront jusqu'à buter sur le haut de l'écran, mais sans disparaître par le haut.
Principales propriétés de CSS | ||
---|---|---|
Propriétés | Statut | Utilisable en |
-moz-border-end | D | [HTML] |
-moz-border-start | D | [HTML] |
-moz-float-edge | D | [HTML] |
-moz-force-broken-image-icon | D | [HTML] |
-moz-image-region | D | [HTML] |
-webkit-font-smoothing | D | [HTML] |
-webkit-tap-highlight-color | D | [HTML] |
-webkit-text-stroke | D | [HTML] |
accent-color | S | [HTML] |
align-content | S | [HTML] |
align-items | S | [HTML] |
align-self | S | [HTML] |
alignment-baseline | S | [HTML], [SVG] |
all | S | [HTML] |
animation | S | [HTML] |
animation-composition | S | [HTML] |
animation-delay | S | [HTML] |
animation-direction | S | [HTML] |
animation-duration | S | [HTML] |
animation-fill-mode | S | [HTML] |
animation-iteration-count | S | [HTML] |
animation-name | S | [HTML] |
animation-play-state | S | [HTML] |
animation-range | X | [HTML] |
animation-range-end | X | [HTML] |
animation-range-start | X | [HTML] |
animation-timeline | X | [HTML] |
animation-timing-function | S | [HTML] |
appearance | X | [HTML] |
aspect-ratio | S | [HTML] |
azimuth | D | [HTML] |
backdrop-filter | S | [HTML] |
backface-visibility | S | [HTML] |
background | S | [HTML] |
background-attachment | S | [HTML] |
background-blend-mode | S | [HTML] |
background-clip | S | [HTML] |
background-color | S | [HTML] |
background-image | S | [HTML] |
background-origin | S | [HTML] |
background-position | S | [HTML] |
background-position-x | S | [HTML] |
background-position-y | S | [HTML] |
background-repeat | S | [HTML] |
background-size | S | [HTML] |
baseline-shift | X | [HTML], [SVG] |
baseline-source | X | [HTML] |
bleed | X | [HTML] |
block-ellipsis | X | [HTML] |
block-size | S | [HTML] |
border | S | [HTML] |
border-block-color | S | [HTML], [SVG] |
border-block-end | S | [HTML], [SVG] |
border-block-end-color | S | [HTML], [SVG] |
border-block-end-style | S | [HTML], [SVG] |
border-block-end-width | S | [HTML], [SVG] |
border-block-start | S | [HTML], [SVG] |
border-block-start-color | S | [HTML], [SVG] |
border-block-start-style | S | [HTML], [SVG] |
border-block-start-width | S | [HTML], [SVG] |
border-block-style | S | [HTML], [SVG] |
border-block-width | S | [HTML], [SVG] |
border-bottom-left-radius | S | [HTML] |
border-bottom-right-radius | S | [HTML] |
border-collapse | S | [HTML] |
border-color | S | [HTML] |
border-end-end-radius | S | [HTML], [SVG] |
border-end-start-radius | S | [HTML], [SVG] |
border-image | S | [HTML] |
border-image-outset | S | [HTML] |
border-image-repeat | S | [HTML] |
border-image-slice | S | [HTML] |
border-image-source | S | [HTML] |
border-image-width | S | [HTML] |
border-inline-color | S | [HTML], [SVG] |
border-inline-end | S | [HTML], [SVG] |
border-inline-end-color | S | [HTML], [SVG] |
border-inline-end-style | S | [HTML], [SVG] |
border-inline-end-width | S | [HTML], [SVG] |
border-inline-start | S | [HTML], [SVG] |
border-inline-start-color | S | [HTML], [SVG] |
border-inline-start-style | S | [HTML], [SVG] |
border-inline-start-width | S | [HTML], [SVG] |
border-inline-style | S | [HTML], [SVG] |
border-inline-width | S | [HTML], [SVG] |
border-radius | S | [HTML] |
border-spacing | S | [HTML] |
border-start-end-radius | S | [HTML], [SVG] |
border-start-start-radius | S | [HTML], [SVG] |
border-style | S | [HTML] |
border-top-left-radius | S | [HTML] |
border-top-right-radius | S | [HTML] |
border-width | S | [HTML] |
bottom | S | [HTML] |
box-align | D | [HTML] |
box-decoration-break | S | [HTML] |
box-direction | D | [HTML] |
box-flex | D | [HTML] |
box-lines | D | [HTML] |
box-ordinal-group | D | [HTML] |
box-orient | D | [HTML] |
box-pack | D | [HTML] |
box-reflect | D | [HTML] |
box-shadow | S | [HTML] |
box-sizing | S | [HTML] |
break-after | S | [HTML] |
break-before | S | [HTML] |
break-inside | S | [HTML] |
caption-side | S | [HTML] |
caret | X | [HTML] |
caret-color | S | [HTML] |
caret-shape | X | [HTML] |
clear | S | [HTML] |
clip | D | [HTML], [SVG] |
clip-path | S | [HTML], [SVG] |
clip-rule | S | [HTML], [SVG] |
color | S | [HTML], [SVG] [1] |
color-adjust | D | [HTML] |
color-interpolation | S | [SVG] |
color-interpolation-filters | S | [SVG] |
column-count | S | [HTML] |
column-fill | S | [HTML] |
column-gap | S | [HTML] |
column-rule | S | [HTML] |
column-rule-color | S | [HTML] |
column-rule-style | S | [HTML] |
column-rule-width | S | [HTML] |
column-span | S | [HTML] |
column-width | S | [HTML] |
columns | S | [HTML] |
contain | S | [HTML] |
contain-intrinsic-block-size | S | [HTML] |
contain-intrinsic-height | S | [HTML] |
contain-intrinsic-inline-size | S | [HTML] |
contain-intrinsic-size | S | [HTML] |
contain-intrinsic-width | S | [HTML] |
container | S | [HTML] |
container-name | S | [HTML] |
container-type | S | [HTML] |
content | S | [HTML] |
content-visibility | S | [HTML] |
counter-increment | S | [HTML] |
counter-reset | S | [HTML] |
counter-set | S | [HTML] |
cue | X | [HTML] |
cue-after | X | [HTML] |
cue-before | X | [HTML] |
cursor | S | [HTML], [SVG] |
cx | S | [SVG] |
cy | S | [SVG] |
direction | S | [HTML], [SVG] |
display | S | [HTML], [SVG] [1] |
dominant-baseline | S | [HTML], [SVG] |
elevation | D | [HTML] |
empty-cells | S | [HTML] |
fill | X | [SVG] |
fill-color | X | [SVG] |
fill-opacity | S | [SVG] |
fill-rule | S | [SVG] |
filter | S | [HTML], [SVG] |
flex | S | [HTML] |
flex-basis | S | [HTML] |
flex-direction | S | [HTML] |
flex-flow | S | [HTML] |
flex-grow | S | [HTML] |
flex-shrink | S | [HTML] |
flex-wrap | S | [HTML] |
float | S | [HTML] |
float-defer | X | [HTML] |
float-offset | X | [HTML] |
float-reference | X | [HTML] |
flood-color | S | [SVG] |
flood-opacity | S | [SVG] |
flow-from | X | [HTML] |
flow-into | X | [HTML] |
font | S | [HTML], [SVG] |
font-effect | D | [HTML] |
font-family | S | [HTML], [SVG] |
font-feature-settings | X | [HTML] |
font-kerning | S | [HTML] |
font-language-override | X | [HTML] |
font-optical-sizing | X | [HTML] |
font-palette | S | [HTML] |
font-size | S | [HTML] |
font-size-adjust | S | [HTML], [SVG] |
font-smooth | D | [HTML] |
font-stretch | S | [HTML], [SVG] |
font-style | S | [HTML], [SVG] |
font-synthesis | S | [HTML] |
font-synthesis-position | X | [HTML] |
font-synthesis-small-caps | X | [HTML] |
font-synthesis-style | X | [HTML] |
font-synthesis-weight | X | [HTML] |
font-variant | S | [HTML], [SVG] |
font-variant-alternates | S | [HTML] |
font-variant-caps | S | [HTML] |
font-variant-east-asian | S | [HTML] |
font-variant-emoji | X | [HTML] |
font-variant-ligatures | S | [HTML] |
font-variant-numeric | S | [HTML] |
font-variant-position | S | [HTML] |
font-variation-settings | X | [HTML] |
font-weight | S | [HTML], [SVG] |
font-width | S | [HTML] |
forced-color-adjust | X | [HTML] |
gap | S | [HTML] |
glyph-orientation-vertical | D | [HTML], [SVG] |
grid | S | [HTML] |
grid-area | S | [HTML] |
grid-auto-columns | S | [HTML] |
grid-auto-flow | S | [HTML] |
grid-auto-rows | S | [HTML] |
grid-column | S | [HTML] |
grid-column-end | S | [HTML] |
grid-column-gap | S | [HTML] |
grid-column-start | S | [HTML] |
grid-gap | S | [HTML] |
grid-row | S | [HTML] |
grid-row-end | S | [HTML] |
grid-row-gap | S | [HTML] |
grid-row-start | S | [HTML] |
grid-template | S | [HTML] |
grid-template-areas | S | [HTML] |
grid-template-columns | S | [HTML] |
grid-template-rows | S | [HTML] |
hanging-punctuation | X | [HTML] |
height | S | [HTML], [SVG] |
hyphenate-character | S | [HTML] |
hyphenate-limit-chars | X | [HTML] |
hyphenate-limit-last | X | [HTML] |
hyphenate-limit-lines | X | [HTML] |
hyphenate-limit-zone | X | [HTML] |
hyphens | S | [HTML] |
image-orientation | S | [HTML] |
image-rendering | S | [HTML], [SVG] |
ime-mode | D | [HTML] |
initial-letter | X | [HTML] |
initial-letter-wrap | X | [HTML] |
inline-size | S | [HTML] |
inset | S | [HTML] |
inset-block | S | [HTML] |
inset-block-end | S | [HTML] |
inset-block-start | S | [HTML] |
inset-inline | S | [HTML] |
inset-inline-end | S | [HTML] |
inset-inline-start | S | [HTML] |
isolation | S | [HTML] |
justify-content | S | [HTML] |
justify-items | S | [HTML] |
justify-self | S | [HTML] |
left | S | [HTML] |
letter-spacing | S | [HTML], [SVG] |
lighting-color | S | [SVG] |
line-break | S | [HTML] |
line-height | S | [HTML] |
line-padding | X | [HTML] |
list-style | S | [HTML] |
list-style-image | S | [HTML] |
list-style-position | S | [HTML] |
list-style-type | S | [HTML] |
margin | S | [HTML] |
margin-block | S | [HTML] |
margin-block-end | S | [HTML] |
margin-block-start | S | [HTML] |
margin-bottom | S | [HTML] |
margin-inline | S | [HTML] |
margin-inline-end | S | [HTML] |
margin-inline-start | S | [HTML] |
margin-left | S | [HTML] |
margin-right | S | [HTML] |
margin-top | S | [HTML] |
margin-trim | X | [HTML] |
marker-end | S | [SVG] |
marker-mid | S | [SVG] |
marker-offset | D | [HTML] |
marker-side | X | [HTML] |
marker-start | S | [SVG] |
marks | X | [HTML] |
mask | S | [HTML], [SVG] |
mask-border | S | [HTML], [SVG] |
mask-border-mode | X | [HTML], [SVG] |
mask-border-outset | X | [HTML], [SVG] |
mask-border-repeat | X | [HTML], [SVG] |
mask-border-slice | X | [HTML], [SVG] |
mask-border-source | X | [HTML], [SVG] |
mask-border-width | X | [HTML], [SVG] |
mask-clip | S | [HTML], [SVG] |
mask-composite | S | [HTML], [SVG] |
mask-image | S | [HTML], [SVG] |
mask-mode | S | [HTML], [SVG] |
mask-origin | S | [HTML], [SVG] |
mask-position | S | [HTML], [SVG] |
mask-repeat | S | [HTML], [SVG] |
mask-size | S | [HTML], [SVG] |
max-block-size | S | [HTML] |
max-height | S | [HTML] |
max-inline-size | S | [HTML] |
max-width | S | [HTML] |
min-block-size | S | [HTML] |
min-height | S | [HTML] |
min-inline-size | S | [HTML] |
min-width | S | [HTML] |
mix-blend-mode | S | [HTML] |
object-fit | S | [HTML] |
object-position | S | [HTML] |
offset | S | [HTML], [SVG] |
offset-anchor | S | [HTML], [SVG] |
offset-distance | S | [HTML], [SVG] |
offset-path | S | [HTML], [SVG] |
offset-position | S | [HTML], [SVG] |
offset-rotate | S | [HTML], [SVG] |
opacity | S | [HTML], [SVG] |
order | S | [HTML] |
orphans | S | [HTML] |
outline | S | [HTML] |
outline-color | S | [HTML] |
outline-offset | S | [HTML] |
outline-style | S | [HTML] |
outline-width | S | [HTML] |
overflow | S | [HTML], [SVG] |
overflow-block | S | [HTML] |
overflow-clip-margin | S | [HTML] |
overflow-inline | S | [HTML] |
overflow-wrap | S | [HTML] |
overflow-x | S | [HTML] |
overflow-y | S | [HTML] |
padding | S | [HTML] |
padding-block | S | [HTML] |
padding-block-end | S | [HTML] |
padding-block-start | S | [HTML] |
padding-bottom | S | [HTML] |
padding-inline | S | [HTML] |
padding-inline-end | S | [HTML] |
padding-inline-start | S | [HTML] |
padding-left | S | [HTML] |
padding-right | S | [HTML] |
padding-top | S | [HTML] |
page-break-after | D | [HTML] |
page-break-before | D | [HTML] |
page-break-inside | D | [HTML] |
paint-order | S | [SVG] |
pause | X | [HTML] |
pause-after | X | [HTML] |
pause-before | X | [HTML] |
perspective | S | [HTML] |
perspective-origin | S | [HTML] |
pitch | D | [HTML] |
pitch-range | D | [HTML] |
place-content | S | [HTML] |
place-items | S | [HTML] |
place-self | S | [HTML] |
play-during | D | [HTML] |
pointer-events | S | [HTML], [SVG] |
position | S | [HTML] |
print-color-adjust | S | [HTML] |
quotes | S | [HTML] |
r | S | [SVG] |
resize | S | [HTML] |
rest | X | [HTML] |
rest-after | X | [HTML] |
rest-before | X | [HTML] |
richness | D | [HTML] |
right | S | [HTML] |
rotate | S | [HTML] |
row-gap | S | [HTML] |
ruby-align | X | [HTML] |
ruby-merge | X | [HTML] |
ruby-overhang | X | [HTML] |
ruby-position | X | [HTML] |
rx | S | [SVG] |
ry | S | [SVG] |
scale | S | [HTML] |
scroll-behavior | S | [HTML] |
scroll-margin | S | [HTML] |
scroll-padding | S | [HTML] |
scroll-snap-align | S | HTML |
scroll-snap-stop | S | [HTML] |
scroll-snap-type | S | {HTML} |
scroll-timeline | X | [HTML] |
scroll-timeline-axis | X | [HTML] |
scroll-timeline-name | X | [HTML] |
scrollbar-3dlight-color | D | [HTML] |
scrollbar-arrow-color | D | [HTML] |
scrollbar-base-color | D | [HTML] |
scrollbar-color | X | [HTML] |
scrollbar-darkshadow-colo | D | [HTML] |
scrollbar-face-color | D | [HTML] |
scrollbar-gutter | X | [HTML] |
scrollbar-highlight-color | D | [HTML] |
scrollbar-shadow-color | D | [HTML] |
scrollbar-track-color | D | [HTML] |
scrollbar-width | X | [HTML] |
shape-image-threshold | S | [HTML] |
shape-margin | S | [HTML] |
shape-outside | S | [HTML] |
shape-rendering | S | [SVG] |
size | S | [HTML] |
speak | X | [HTML] |
speak-as | X | [HTML] |
speak-header | D | [HTML] |
speak-numeral | D | [HTML] |
speak-punctuation | D | [HTML] |
speech-rate | D | [HTML] |
stress | D | [HTML] |
stroke | S | [SVG] |
stroke-color | X | [SVG] |
stroke-dash-corner | X | [SVG] |
stroke-dash-justify | X | [SVG] |
stroke-dasharray | S | [SVG] |
stroke-dashoffset | S | [SVG] |
stroke-linecap | S | [SVG] |
stroke-linejoin | S | [SVG] |
stroke-miterlimit | S | [SVG] |
stroke-opacity | S | [SVG] |
stroke-width | S | [SVG] |
tab-size | S | [HTML] |
table-layout | S | [HTML] |
text-align | S | [HTML] |
text-align-all | X | [HTML] |
text-align-last | S | [HTML] |
text-anchor | S | [SVG] |
text-autospace | X | [HTML] |
text-box-edge | X | [HTML] |
text-box-trim | X | [HTML] |
text-combine-upright | S | [HTML] |
text-decoration | S | [HTML], [SVG] [1] |
text-decoration-color | S | [HTML] |
text-decoration-line | S | [HTML], [SVG] |
text-decoration-skip | X | [HTML] |
text-decoration-skip-box | X | [HTML] |
text-decoration-skip-ink | X | [HTML], [SVG] |
text-decoration-skip-inset | X | [HTML] |
text-decoration-skip-self | X | [HTML] |
text-decoration-skip-spaces | X | [HTML] |
text-decoration-style | S | [HTML], [SVG] |
text-decoration-thickness | S | [HTML], [SVG] |
text-emphasis | S | [HTML], [SVG] |
text-emphasis-color | S | [HTML], [SVG] |
text-emphasis-position | S | [HTML], [SVG] |
text-emphasis-skip | X | [HTML] |
text-emphasis-style | S | [HTML], [SVG] |
text-group-align | X | [HTML] |
text-indent | S | [HTML] |
text-justify | X | [HTML] |
text-orientation | S | [HTML] |
text-overflow | S | [HTML] |
text-rendering | S | [HTML] [1], [SVG] |
text-shadow | S | [HTML], [SVG] |
text-size-adjust | X | [HTML] |
text-space-collapse | D | [HTML] |
text-space-trim | D | [HTML] |
text-spacing | X | [HTML] |
text-spacing-trim | X | [HTML] |
text-transform | S | [HTML], [SVG] |
text-underline-offset | S | [HTML], [SVG] |
text-underline-position | S | [HTML], [SVG] |
text-wrap | X | [HTML] |
timeline-scope | X | [HTML] |
top | S | [HTML] |
touch-action | S | [HTML] |
transform | S | [HTML], [SVG] |
transform-box | S | [HTML], [SVG] |
transform-origin | S | [HTML], [SVG] |
transform-style | S | [HTML] |
transition | S | [HTML] |
transition-behavior | S | [HTML] |
transition-delay | S | [HTML] |
transition-duration | S | [HTML] |
transition-property | S | [HTML] |
transition-timing-function | S | [HTML] |
translate | S | [HTML] |
unicode-bidi | S | [HTML], [SVG] |
user-select | S | [HTML] |
vector-effect | X | [SVG] |
vertical-align | S | [HTML] |
view-timeline | X | [HTML] |
view-timeline-axis | X | [HTML] |
view-timeline-inset | X | [HTML] |
view-timeline-name | X | [HTML] |
view-transition-name | S | [HTML] |
visibility | S | [HTML], [SVG] |
voice-balance | X | [HTML] |
voice-duration | X | [HTML] |
voice-family | X | [HTML] |
voice-pitch | X | [HTML] |
voice-range | X | [HTML] |
voice-rate | X | [HTML] |
voice-stress | X | [HTML] |
voice-volume | X | [HTML] |
volume | D | [HTML] |
white-space | S | [HTML] |
white-space-collapse | S | [HTML] |
white-space-trim | X | [HTML] |
widows | S | [HTML] |
width | S | [HTML], [SVG] |
will-change | S | [HTML] |
word-boundary-detection | X | [HTML] |
word-boundary-expansion | D | [HTML] |
word-break | S | [HTML] |
word-space-transform | X | [HTML] |
word-spacing | S | [HTML],[SVG] |
word-wrap | S | [HTML] |
wrap-after | X | [HTML] |
wrap-before | X | [HTML] |
wrap-inside | X | [HTML] |
writing-mode | S | [HTML], [SVG] |
x | S | [SVG] |
y | S | [SVG] |
z-index | S | [HTML] |
zoom | X | [HTML] | 510 propriétés listées |