WebKit (-webkit-) vendor-präfixierte CSS-Erweiterungen

-webkit-präfixierte Eigenschaften ohne standardisierte Entsprechungen

A-C

• -webkit-app-region Veraltet : Wird in Safari nicht mehr unterstützt.
• -webkit-border-horizontal-spacing
• -webkit-border-vertical-spacing
• -webkit-box-reflect: Aus Kompatibilitätsgründen mit -webkit- in jedem Browser unterstützt.
• -webkit-column-axis: In Chrome nicht unterstützt.
• -webkit-column-progression: In Chrome nicht unterstützt.
• -webkit-cursor-visibility: In Chrome nicht unterstützt.

D-L

• -webkit-font-smoothing: Siehe font-smooth.
• -webkit-hyphenate-limit-after: In Chrome nicht unterstützt.
• -webkit-hyphenate-limit-before: In Chrome nicht unterstützt.
• -webkit-hyphenate-limit-lines: In Chrome nicht unterstützt.
• -webkit-line-align: In Chrome nicht unterstützt.
• -webkit-line-box-contain: In Chrome nicht unterstützt.
• -webkit-line-grid: In Chrome nicht unterstützt.
• -webkit-line-snap: In Chrome nicht unterstützt.
• -webkit-locale
• -webkit-logical-height
• -webkit-logical-width

M

• -webkit-margin-after
• -webkit-margin-before
• -webkit-mask-box-image: Siehe mask-border und border-image.
• -webkit-mask-box-image-outset: Siehe mask-border und border-image.
• -webkit-mask-box-image-repeat: Siehe mask-border und border-image.
• -webkit-mask-box-image-slice: Siehe mask-border und border-image.
• -webkit-mask-box-image-source: Siehe mask-border und border-image.
• -webkit-mask-box-image-width: Siehe mask-border und border-image.
• -webkit-mask-composite: Siehe mask-border und border-image.
• -webkit-mask-position-x: Aus Kompatibilitätsgründen mit -webkit- in jedem Browser unterstützt.
• -webkit-mask-position-y: Aus Kompatibilitätsgründen mit -webkit- in jedem Browser unterstützt.
• -webkit-mask-repeat-x Veraltet : Nicht mehr unterstützt; siehe mask-repeat.
• -webkit-mask-repeat-y Veraltet : Nicht mehr unterstützt; siehe mask-repeat.
• -webkit-mask-source-type: In Chrome nicht unterstützt.
• -webkit-max-logical-height
• -webkit-max-logical-width
• -webkit-min-logical-height
• -webkit-min-logical-width

N-Z

• -webkit-nbsp-mode: In Chrome nicht unterstützt.
• -webkit-perspective-origin-x
• -webkit-perspective-origin-y
• -webkit-rtl-ordering
• -webkit-tap-highlight-color: Nur in Safari auf iOS unterstützt.
• -webkit-text-decoration-skip: In Chrome nicht unterstützt.
• -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: In Chrome nicht unterstützt.
• -webkit-touch-callout Veraltet : Nur in Safari auf iOS unterstützt.
• -webkit-transform-origin-x
• -webkit-transform-origin-y
• -webkit-transform-origin-z
• -webkit-user-drag
• -webkit-user-modify

-webkit-präfixierte Eigenschaften mit standardisierten Entsprechungen

Mehrere -webkit- präfixierte Eigenschaften haben standardisierte Entsprechungen. Auch wenn der Name und die Syntax unterschiedlich sein können, sollten sie nicht mehr verwendet werden. Für jede der unten aufgeführten Eigenschaften verwenden Sie die standardisierten Entsprechungen.

A-B

• -webkit-border-after: Verwenden Sie border-block-end.
• -webkit-border-after-color: Verwenden Sie border-block-end-color.
• -webkit-border-after-style: Verwenden Sie border-block-end-style.
• -webkit-border-after-width: Verwenden Sie border-block-end-width.
• -webkit-border-before: Verwenden Sie border-block-start.
• -webkit-border-before-color: Verwenden Sie border-block-start-color.
• -webkit-border-before-style: Verwenden Sie border-block-start-style.
• -webkit-border-before-width: Verwenden Sie border-block-start-width.
• -webkit-border-end: Verwenden Sie border-inline-end.
• -webkit-border-end-color: Verwenden Sie border-inline-end-color.
• -webkit-border-end-style: Verwenden Sie border-inline-end-style.
• -webkit-border-end-width: Verwenden Sie border-inline-end-width.
• -webkit-border-start: Verwenden Sie border-inline-start.
• -webkit-border-start-color: Verwenden Sie border-inline-start-color.
• -webkit-border-start-style: Verwenden Sie border-inline-start-style.
• -webkit-border-start-width: Verwenden Sie border-inline-start-width.
• -webkit-box-align: Verwenden Sie CSS flexbox mit align-items.
• -webkit-box-direction: Verwenden Sie CSS flexbox mit flex-direction.
• -webkit-box-flex-group: Verwenden Sie CSS flexbox mit flex-basis, flex-grow, und flex-shrink.
• -webkit-box-flex: Verwenden Sie CSS flexbox mit flex-grow.
• -webkit-box-lines: Verwenden Sie CSS flexbox mit flex-flow.
• -webkit-box-ordinal-group: Verwenden Sie CSS flexbox mit order.
• -webkit-box-orient: Verwenden Sie CSS flexbox mit flex-direction.
• -webkit-box-pack: Verwenden Sie CSS flexbox mit justify-content.
• -webkit-box-reflect: Verwenden Sie die CSS-Funktion element().

C-I

• -webkit-column-break-after: Verwenden Sie CSS Mehrspalten-Layout mit break-after.
• -webkit-column-break-before: Verwenden Sie CSS Mehrspalten-Layout mit break-before.
• -webkit-column-break-inside: Verwenden Sie CSS Mehrspalten-Layout mit break-inside.
• -webkit-font-feature-settings: Verwenden Sie font-feature-settings (die präfixierte Version wird in Safari nicht unterstützt).
• -webkit-hyphenate-character: Verwenden Sie hyphenate-character.
• -webkit-initial-letter: Verwenden Sie initial-letter.

J-Z

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

-webkit-präfixierte Eigenschaftswerte

-webkit-fill-available

Verwendet mit Größeneigenschaften wie width und height, um Elementen zu ermöglichen, den gesamten verfügbaren Platz innerhalb ihres übergeordneten Containers einzunehmen. Der Wert stretch bietet eine standardmäßige Ersatzlösung, aber -webkit-fill-available wird aus Gründen der Rückwärtskompatibilität als Alias von Browsern unterstützt.

Pseudo-Klassen

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

Pseudo-Elemente

Aus Gründen der Web-Kompatibilität behandeln Blink, WebKit und Gecko-Browser alle Pseudo-Elemente, die mit ::-webkit- beginnen, als gültig. Wenn es ein ungültiges Pseudo-Element oder eine ungültige Pseudo-Klasse innerhalb einer Kette oder Gruppe von Selektoren gibt, ist die gesamte Selektorliste ungültig. Wenn ein Pseudo-Element (aber keine Pseudo-Klasse) ein -webkit- Präfix hat, gehen die Blink-, WebKit- und Gecko-Browser davon aus, dass es gültig ist und die Selektorliste nicht ungültig macht.

• ::-webkit-file-upload-button: Verwenden Sie ::file-selector-button
• ::-webkit-inner-spin-button
• ::-webkit-input-placeholder: Verwenden Sie ::placeholder
• ::-webkit-meter-bar Veraltet
• ::-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

Medienfeatures

• -webkit-animation Veraltet
• -webkit-device-pixel-ratio: Unterstützt für alle Browser
• -webkit-transform-2d Veraltet
• -webkit-transform-3d: Unterstützt für alle Browser
• -webkit-transition Veraltet

Siehe auch

• Mozilla (-moz-) vendor-präfixierte CSS-Erweiterungen
• Glossareintrag Vendor-Präfix
• Styling von Formularelementen im WebKit Trac