CSS属性前缀的作用是什么?

作用:在一个新CSS属性还未成为标准时,让浏览器提前支持。w3c制定标准是很慢的;而浏览器商市场推广时间紧,如果一个属性已经够成熟了,就会在浏览器中加入支持;而为避免日后w3c公布标准时有所变更,加入一个私有前缀,来提前支持新属性。

CSS属性前缀的作用是什么?

使用过CSS3属性的同学都知道,CSS3属性都需要带各浏览器的前缀,甚至到现在,依然还有很多属性需要带前缀。

浏览器厂商以前就一直在实施CSS3,但它还未成为真正的标准。为此,当一些CSS3样式语法还存在波动时,它们提供针对浏览器的前缀。现在主要流行的浏览器内核主要有:

Trident内核:主要代表为IE浏览器

Gecko内核:主要代表为Firefox

立即学习“前端免费学习笔记(深入)”;

Presto内核:主要代表为Opera

Webkit内核:产要代表为Chrome和Safari

而这些不同内核的浏览器,CSS3属性(部分需要添加前缀的属性)对应需要添加不同的前缀,也将其称之为浏览器的私有前缀,添加上私有前缀之后的CSS3属性可以说是对应浏览器的私有属性:

Trident内核:前缀为-ms

Gecko内核:前缀为-moz

Presto内核:前缀为-o

Webkit内核:前缀为-webkit

CSS属性前缀的作用

浏览器私有前缀,是浏览器对于新CSS属性的一个提前支持。

为了兼容老版本的写法。例如:比较新版本的浏览器都支持直接写:border-radius。

-moz代表firefox浏览器私有属性,-ms代表ie浏览器私有属性,-webkit代表safari、chrome私有属性。

因为制定HTML和CSS标准的组织W3C动作是很慢的。

通常,有w3c组织成员提出一个新属性,比如说圆角border-radius,大家都觉得好,但w3c制定标准,要走很复杂的程序,审查等。而浏览器商市场推广时间紧,如果一个属性已经够成熟了,就会在浏览器中加入支持。

为避免日后w3c公布标准时有所变更,加入一个私有前缀,比如-webkit-border-radius,通过这种方式来提前支持新属性。

等到日后w3c公布了标准,border-radius的标准写法确立之后,再让新版的浏览器支持border-radius这种写法。

更多编程相关知识,请访问:编程课程!!

以上就是CSS属性前缀的作用是什么?的详细内容,更多请关注【创想鸟】其它相关文章!

版权声明:本文内容由互联网用户自发贡献,该文观点仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌抄袭侵权/违法违规的内容, 请发送邮件至253000106@qq.com举报,一经查实,本站将立刻删除。

发布者:PHP中文网,转转请注明出处:https://www.chuangxiangniao.com/p/2884510.html

(0)
上一篇 2025年3月10日 20:29:22
下一篇 2025年3月6日 08:08:29

AD推荐 黄金广告位招租... 更多推荐

相关推荐

  • CleverCSS是什么?

    CleverCSS是一个用于css的小型标记语言,从Python得到灵感,采用通过简单和干净的结构方式,它可用于以整洁和结构化的方式创建一个样式表;CleverCSS与CSS最明显的区别是句法,它基于缩进而且不单调。 CleverCSS是一…

    2025年3月10日
    200
  • css实现倒计时效果

    一、实现效果截图 (学习视频推荐:css视频教程) 二、实现原理  立即学习“前端免费学习笔记(深入)”; 看到上图效果应该很容易猜到原理,纯CSS的话使用轮播。通过改变图片的margin-top,再加上亿点点动画,亿点点数字图片,就实现了…

    2025年3月10日 编程技术
    200
  • 你可能还不知道的7个惊人的css属性!

    推荐教程:CSS视频教程 学习CSS是构建好看网页的一种方式。 但是,在学习过程中,我们倾向于(大部分时间)限制自己,一遍又一遍地使用相同的属性。 毕竟,我们是一种习惯性的动物,我们会使用自己习惯且熟悉的东西。 因此,在这篇文章中,向你介绍…

    2025年3月10日 编程技术
    200
  • 响应式css前端框架有哪些

    响应式css前端框架有:1、Semantic UI Framework;2、Less Framework;3、Foundation Framework;4、UIkit Framework;5、YUI Framework。 常用的响应式css…

    2025年3月10日
    200
  • css盒模型有哪些属性

    css盒模型的属性有:1、margin属性;2、border属性;3、transparent属性;4、padding属性。 本教程操作环境:windows10系统、css3,本文适用于所有品牌的电脑。 CSS盒模型是定义元素周围的间隔、尺寸…

    2025年3月10日
    200
  • css中的animation是什么

    css中的animation是一个简写属性,用于设置动画属性,如【animation-duration】,规定完成动画所花费的时间,该属性必须规定,否则动画时长为0,无法播放。 本教程操作环境:windows10系统、css3,本文适用于所…

    2025年3月10日
    200
  • css为什么会出现清除浮动的问题

    css出现清除浮动的问题的原因:在标准流下面,父元素没有设置高度属性,且父元素中的子元素是浮动,由于浮动元素不再占用原文档流的位置,浮动元素的高度不会计算在父元素的高度中,即呈现塌陷的状态。 本教程操作环境:windows10系统、css3…

    2025年3月10日
    200
  • css怎么改变hr标签颜色

    css改变hr标签颜色的方法:可以利用background-color属性,并结合border和height属性来实现。border属性是为了防止出现黑框,height属性是为了防止在firefox下不显示。 首先我们要知道,如果要修改hr…

    2025年3月10日
    200
  • css圆角属性是什么

    css圆角属性是border-radius,通过该属性我们可以给任何元素制作圆角,例如【border-radius: 15px 50px 30px 5px】。如果我们在border-redius属性中只指定一个值,那么将生成四个圆角。 圆角…

    2025年3月10日 编程技术
    200
  • css如何让盒子浮动

    css让盒子浮动的方法:可以利用float属性来实现,如【float: left;】。float属性可以让多个盒子水平排列成一行、居左或居右,盒子的宽度不再伸展,而是根据盒子里面的内容的宽度来决定。 盒子的浮动 在标准流中,一个块级元素在水…

    2025年3月10日
    200

发表回复

登录后才能评论