Extensions CSS préfixées par le vendeur WebKit (-webkit-)

Propriétés préfixées par -webkit sans équivalents standard

A - C

• -webkit-app-region Obsolète  : N'est plus pris en charge dans Safari.
• -webkit-border-horizontal-spacing
• -webkit-border-vertical-spacing
• -webkit-box-reflect : Prise en charge avec -webkit- par tous les navigateurs, pour des raisons de compatibilité.
• -webkit-column-axis : N'est pas pris en charge dans Chrome.
• -webkit-column-progression : N'est pas pris en charge dans Chrome.
• -webkit-cursor-visibility : N'est pas pris en charge dans Chrome.

D-L

• -webkit-font-smoothing : Voir font-smooth.
• -webkit-hyphenate-limit-after : N'est pas pris en charge dans Chrome.
• -webkit-hyphenate-limit-before : N'est pas pris en charge dans Chrome.
• -webkit-hyphenate-limit-lines : N'est pas pris en charge dans Chrome.
• -webkit-line-align : N'est pas pris en charge dans Chrome.
• -webkit-line-box-contain : N'est pas pris en charge dans Chrome.
• -webkit-line-grid : N'est pas pris en charge dans Chrome.
• -webkit-line-snap : N'est pas pris en charge dans Chrome.
• -webkit-locale
• -webkit-logical-height
• -webkit-logical-width

M

• -webkit-margin-after
• -webkit-margin-before
• -webkit-mask-box-image : Voir mask-border et border-image.
• -webkit-mask-box-image-outset : Voir mask-border et border-image.
• -webkit-mask-box-image-repeat : Voir mask-border et border-image.
• -webkit-mask-box-image-slice : Voir mask-border et border-image.
• -webkit-mask-box-image-source : Voir mask-border et border-image.
• -webkit-mask-box-image-width : Voir mask-border et border-image.
• -webkit-mask-composite : Voir mask-border et border-image.
• -webkit-mask-position-x : Prise en charge avec -webkit- par tous les navigateurs, pour des raisons de compatibilité.
• -webkit-mask-position-y : Prise en charge avec -webkit- par tous les navigateurs, pour des raisons de compatibilité.
• -webkit-mask-repeat-x Obsolète  : N'est plus prise en charge ; utilisez mask-repeat.
• -webkit-mask-repeat-y Obsolète  : N'est plus prise en charge ; utilisez mask-repeat.
• -webkit-mask-source-type: N'est pas pris en charge dans Chrome.
• -webkit-max-logical-height
• -webkit-max-logical-width
• -webkit-min-logical-height
• -webkit-min-logical-width

N - Z

• -webkit-nbsp-mode : N'est pas pris en charge dans Chrome.
• -webkit-perspective-origin-x
• -webkit-perspective-origin-y
• -webkit-rtl-ordering
• -webkit-tap-highlight-color : N'est pris en charge que dans Safari sur iOS.
• -webkit-text-decoration-skip : N'est pas pris en charge dans Chrome.
• -webkit-text-decorations-in-effect
• -webkit-text-fill-color
• -webkit-text-security
• -webkit-text-stroke
• -webkit-text-stroke-color
• -webkit-text-stroke-width
• -webkit-text-zoom : N'est pas pris en charge dans Chrome.
• -webkit-touch-callout Obsolète : N'est pris en charge que dans Safari sur iOS.
• -webkit-transform-origin-x
• -webkit-transform-origin-y
• -webkit-transform-origin-z
• -webkit-user-drag
• -webkit-user-modify

Propriétés préfixées par -webkit avec équivalents standard

Plusieurs propriétés préfixées par -webkit- ont des équivalents standard. Même si le nom et la syntaxe peuvent être différents, elles ne devraient plus être utilisées. Pour chacune des propriétés ci-dessous, utilisez les équivalents standard.

A-B

• -webkit-border-after : Utilisez border-block-end.
• -webkit-border-after-color : Utilisez border-block-end-color.
• -webkit-border-after-style : Utilisez border-block-end-style.
• -webkit-border-after-width : Utilisez border-block-end-width.
• -webkit-border-before : Utilisez border-block-start.
• -webkit-border-before-color : Utilisez border-block-start-color.
• -webkit-border-before-style : Utilisez border-block-start-style.
• -webkit-border-before-width : Utilisez border-block-start-width.
• -webkit-border-end : Utilisez border-inline-end.
• -webkit-border-end-color : Utilisez border-inline-end-color.
• -webkit-border-end-style : Utilisez border-inline-end-style.
• -webkit-border-end-width : Utilisez border-inline-end-width.
• -webkit-border-start : Utilisez border-inline-start.
• -webkit-border-start-color : Utilisez border-inline-start-color.
• -webkit-border-start-style : Utilisez border-inline-start-style.
• -webkit-border-start-width : Utilisez border-inline-start-width.
• -webkit-box-align : Utilisez les flexbox avec align-items.
• -webkit-box-direction : Utilisez les flexbox avec flex-direction.
• -webkit-box-flex-group : Utilisez les flexbox avec flex-basis, flex-grow et flex-shrink.
• -webkit-box-flex : Utilisez les flexbox avec flex-grow.
• -webkit-box-lines : Utilisez les flexbox avec flex-flow.
• -webkit-box-ordinal-group : Utilisez les flexbox avec order.
• -webkit-box-orient : Utilisez les flexbox avec flex-direction.
• -webkit-box-pack : Utilisez les flexbox avec justify-content.
• -webkit-box-reflect : Utilisez la fonction CSS element().

C-I

• -webkit-column-break-after : Utilisez la mise en page multicolonne CSS avec break-after.
• -webkit-column-break-before : Utilisez la mise en page multicolonne CSS avec break-before.
• -webkit-column-break-inside : Utilisez la mise en page multicolonne CSS avec break-inside.
• -webkit-font-feature-settings : Utilisez font-feature-settings (la version préfixée n'est pas prise en charge dans Safari).
• -webkit-hyphenate-character : Utilisez hyphenate-character.
• -webkit-initial-letter : Utilisez initial-letter.

J-Z

• -webkit-line-clamp : Utilisez line-clamp.
• -webkit-margin-end : Utilisez margin-block-end.
• -webkit-margin-start : Utilisez margin-block-start.
• -webkit-padding-after : Utilisez padding-block-end.
• -webkit-padding-before : Utilisez padding-block-start.
• -webkit-padding-end : Utilisez padding-inline-end.
• -webkit-padding-start : Utilisez padding-inline-start.

Pseudo-classes

• :-webkit-any() : Utilisez :is
• :-webkit-any-link : Utilisez :any-link
• :-webkit-autofill : Utilisez :autofill
• :-webkit-autofill-strong-password : Utilisez :autofill
• :-webkit-drag
• :-webkit-full-page-media : Utilisez :fullscreen
• :-webkit-full-screen : Utilisez :fullscreen
• :-webkit-full-screen-ancestor : Utilisez :fullscreen
• :-webkit-full-screen-document : Utilisez :fullscreen
• :-webkit-full-screen-controls-hidden : Utilisez :fullscreen

Pseudo-éléments

Pour des raisons de compatibilité web, Blink, WebKit et Gecko traitent tous les pseudo-éléments commençant par ::-webkit- comme valides. Si un pseudo-élément ou une pseudo-classe invalide se trouve dans une chaîne ou un groupe de sélecteurs, l'ensemble de la liste de sélecteurs est invalide. Si un pseudo-élément (mais pas une pseudo-classe) a un préfixe -webkit-, les navigateurs Blink, WebKit et Gecko supposent qu'il est valide, sans invalider la liste des sélecteurs.

• ::-webkit-file-upload-button : Utilisez ::file-selector-button
• ::-webkit-inner-spin-button
• ::-webkit-input-placeholder : Utilisez ::placeholder
• ::-webkit-meter-bar Obsolète
• ::-webkit-meter-even-less-good-value
• ::-webkit-meter-inner-element
• ::-webkit-meter-optimum-value
• ::-webkit-meter-suboptimum-value
• ::-webkit-progress-bar
• ::-webkit-progress-inner-element
• ::-webkit-progress-value
• ::-webkit-search-cancel-button
• ::-webkit-search-results-button
• ::-webkit-slider-runnable-track
• ::-webkit-slider-thumb

Fonctionnalités multimédias

• -webkit-animation Obsolète
• -webkit-device-pixel-ratio : Prise en charge multiplateforme
• -webkit-transform-2d Obsolète
• -webkit-transform-3d : Prise en charge multiplateforme
• -webkit-transition Obsolète

Voir aussi

• Extensions CSS préfixées par le vendeur Firefox (-moz-)
• L'entrée du glossaire Préfixe vendeur.
• La mise en forme des contrôles de formulaires sur le Trac WebKit ^(angl.)