作者:小Reve_942 | 来源:互联网 | 2023-05-18 12:08
使用过CSS3属性的同学都知道,CSS3属性都需要带各浏览器的前缀,甚至到现在,依然还有很多属性需要带前缀。这是为什么呢(兼容自家老版本浏览器)?Trident内核:主要代表为IE浏览器Gecko内核
使用过CSS3属性的同学都知道,CSS3属性都需要带各浏览器的前缀,甚至到现在,依然还有很多属性需要带前缀。这是为什么呢(兼容自家老版本浏览器)?
- Trident内核:主要代表为IE浏览器
- Gecko内核:主要代表为Firefox
- Presto内核:主要代表为Opera
- Webkit内核:产要代表为Chrome和Safari
而这些不同内核的浏览器,CSS3属性(部分需要添加前缀的属性)对应需要添加不同的前缀,也将其称之为浏览器的私有前缀,添加上私有前缀之后的CSS3属性可以说是对应浏览器的私有属性:
- Trident内核:前缀为
-ms
- Gecko内核:前缀为
-moz
- Presto内核:前缀为
-o
- Webkit内核:前缀为
-webkit
来看一个简单的示例,早期写一个圆角border-radius
,需要这样写:
.box {
-moz-border-radius: 5px;
-webkit-border-radius: 5px;
-o-border-radius: 5px;
border-radius: 5px;
}