CSS Filter - Prefix Filters

Prefix Filters

Most browsers have CSS tags that apply to that browser only, or at least to the underlying render engine. The prefix on these tags are specific to each rendering engine. Here is an example.

/*Cross browser css3 linear-gradient */ .linear-gradient{ /*Gecko Browser (Firefox)*/ background-image: -moz-linear-gradient(top, #D7D 0%, #068 100%); /* Opera */ background-image: -o-linear-gradient(top, #D7D 0%, #068 100%); /* Older Webkit Syntax*/ background-image: -webkit-gradient(linear, left top, left bottom, color-stop(0, #D7D),color-stop(1, #068)); /* Webkit (Safari, Chrome, iOS, Android) */ background-image: -webkit-linear-gradient(top, #D7D 0%, #068 100%); /* w3c */ background-image: linear-gradient(top, #D7D 0%, #068 100%); }

Trident -ms- — All experimental properties are prefixed with "-ms-", e.g. -ms-interpolation-mode instead of interpolation-mode.

Gecko -moz- — All experimental selectors, properties and values are prefixed with "-moz-", e.g. ::-moz-selection instead of ::selection.

WebKit -webkit- — All experimental selectors, properties and values are prefixed with "-webkit-", e.g. -webkit-box-shadow instead of box-shadow.

KHTML -khtml- — All experimental selectors, properties and values are prefixed with "-khtml-", e.g. -khtml-opacity instead of opacity.

Presto

1. -xv- — All new selectors, properties and values introduced by CSS3 Speech Module are prefixed with "-xv-" (but not found in CSS2 aural style sheets), e.g. -xv-voice-rate instead of voice-rate.
2. -o- — All experimental properties are prefixed with "-o-", e.g. -o-transition-property instead of transition-property.

The DOM properties corresponding to vendor-specific experimental CSS properties are prefixed with the vendor-prefix, without any hyphens.