CSS3 - HTML5 Mastery: Semantics, Standards, and Styling - page 227

the text color to yellow (this is a simple example; we'll get into proper color formatting
later).
A CAVEAT: BROWSER CSS3 PROPERTY PREFIXES
As with HTML5, the majority of the CSS3 module specifications are in draft status
and being actively refined, which means not all features are implemented across all
browsers. And since the specifications are in flux, web browser manufacturers are
rightly wary of implementing a particular CSS property in a specification if it could
change drastically the next week. The compromise that has been made is to use a con-
vention of prefixes specific to a particular browser that labels a property as a “work
in progress.” If a web developer sees the prefix, they know that “Ahh, this property
could change in the future.” Once the property is standardized, the web browsers im-
plement the actual property listed in the specification, and web developers can stop
using the prefixed version. The CSS property prefixes for major browsers are as fol-
lows:
• -webkit- for Safari and Google Chrome
• -moz- for Firefox
• -o- for Opera
• -ms- for Internet Explorer
For example, there is a CSS property called transform that can be used to, for ex-
ample, rotate a piece of content, among other effects. The problem is this property is
part of a module specification that is in Working Draft status, so the following prop-
erties are available to the web developer:
• -webkit-transform
• -moz-transform
• -o-transform
• -ms-transform
When creating a CSS style rule, the web developer would repeat the property with
each browser prefix, ending at the end of the list with the actual property as defined
in the relevant specification:
-webkit-transform: rotate(45deg);
-moz-transform: rotate(45deg);
-o-transform: rotate(45deg);
transform: rotate(45deg);