What CSS3 features still need vendor prefixes?

问题:

The most common features I remember needing prefixes for were features such as flexbox, border-radius, box-shadow, etc... but now they are supported. With more users switching to more powerful browsers like Chrome and Firefox and away from IE, are there still features now that haven't been fully supported and require prefixes?

回答1:

There is a great site which allows you to check out support of any css property by most modern browsers. It also shows info about vendor prefixes (if they are needed). This site is named "Can I use" - http://caniuse.com

回答2:

Use the site http://shouldiprefix.com. It has the single purpose to "show what prefixes are needed for a newer CSS property."

Just enter the property you're interested in the search field, and it will return something like the below graphic:

回答3:

Browser vendors are getting better at supporting features. That said, some newer or experimental features will require a prefix; but trying to remember or memorize them seems impractical.

You can check if your CSS needs any vendor prefixes by using tools like Autoprefixer CSS online. This tool generates prefixes based on the information provided from canIuse.

If you're using build tools for your project, check out:

• gulp-autoprefixer
• grunt-postcss

回答4:

"...are there still features now that haven't been fully supported and require prefixes?"

Yes, and there will always be, as it's kind of an industry standard that vendors use their prefix on newly drafted properties/methods until those become a standard.

I recommend you check the ones you are going to use, instead of searching for the ones that still has.

MDN provides an excellent site with both status, explanations, samples and browser support.