CSS3 Vendor-prefixing

  Browser vendors needed a way to add support for new features that were not yet standardized, but without messing up later changes or creating incompatibles. To solve this issue Vendor Prefixes were created. A vendor prefixes is a special prefix added to a CSS property. Each rendering engine has it's own prefix which will only apply the property to that particular browser.css

The major browsers use the following prefixes:git

  • -webkit- (Chrome, Safari, newer versions of Opera, almost all iOS browsers (including Firefox for iOS); basically, any WebKit based browser)
  • -moz- (Firefox)
  • -o- (Old, pre-WebKit, versions of Opera)
  • -ms- (Internet Explorer and Microsoft Edge)

So, for exmaple, a Firefox prefix for the transform property will be written as -github

.example {
  -moz-transform: value;
 -moz-border-radius: 10px;
 -webkit-border-radius: 10px;
-o-border-radius: 10px;
 border-radius: 10px;
}

 

Autoprefixer 

  Working with Autoprefixer is simple: just forget about vendor prefixes and write normal CSS according to the latest W3C specs. You don’t need a special language (like Sass) or remember where you must use mixins.web

Autoprefixer supports selectors (like :fullscreen and ::selection), unit function (calc()), at‑rules (@supports and @keyframes) and properties.app

Because Autoprefixer is a postprocessor for CSS, you can also use it with preprocessors such as Sass, Stylus or LESS.post

 

 

https://github.com/sindresorhus/sublime-autoprefixerthis


 

 

 

 

 

 

 

 

 

 

 

 

https://www.w3.org/TR/CSS/#cssspa

相關文章
相關標籤/搜索