Because CSS3 has not yet become a true standard, many browsers have different levels of support for it, and each browser manufacturer supports the same style in different ways, so a prefix must be added to reach each browser. compatible. The css3 prefix is used to ensure that new properties can be recognized and take effect under a specific browser rendering engine.
The operating environment of this tutorial: Windows 7 system, CSS3&&HTML5 version, Dell G3 computer.
Students who have used CSS3 attributes know that CSS3 attributes need to be prefixed by each browser. Even now, there are still many attributes that need to be prefixed. Why is this?
Browser manufacturers have been implementing CSS3 before, but it has not yet become a true standard.
Because many properties of CSS3 have not yet been determined, the standard specifications have not yet been released, many browsers have different levels of support, and each browser manufacturer supports different writing methods for the same style, so prefixes must be added. To achieve compatibility across browsers, there will be no need to write prefixes when the specifications are unified in the future.
The css3 prefix is used to ensure that this attribute can be recognized and effective under a specific browser rendering engine.
Prefix | Browser | Kernel |
---|---|---|
- ms- | IE browser | Trident kernel |
-moz- | Firefox | Gecko kernel |
-o- | Opera | Presto Kernel |
-webkit- | Chrome and Safari | Webkit kernel |
There are many private prefixes that can be omitted, but in order to be compatible with older versions of browsers, you can still use private prefixes Prefixes and standard methods, gradual transition.
Let’s look at a simple example. To write a rounded border-radius in the early stage, you need to write it like this:
.box { border-radius: 5px; -moz-border-radius: 5px; -webkit-border-radius: 5px; -o-border-radius: 5px; }
These are for compatibility with the old version of writing. The browser does not support the new attributes. This results in a reduced user experience; newer versions of browsers support writing directly: border-radius.
Using the prefix can match the lower version of the browser well and display the style normally.
(Learning video sharing: css video tutorial)
The above is the detailed content of Why does css3 need to be prefixed?. For more information, please follow other related articles on the PHP Chinese website!