JavaScript 工具库 | PrefixFree给CSS自动添加浏览器前缀
2023-12-27 13:48:35
新版的CSS拥有多个新属性,而标准有没有统一,有的浏览器厂商为了吸引更多的开发者和用户,已经加入了最新的CSS属性支持,这其中包含了很多炫酷的功能,但是我们在使用的时候,不得不在属性前面添加这些浏览器的私有前缀,这样的代码量一下就大了不少。
为了解决这个问题,国外的牛人开发了了一个 -Prefix-free 的插件,能够自动给我们添加这些前缀,我们仅仅需要编写一次代码,无需在考虑是否兼容其他浏览器,而且如果后面浏览器支持这个属性了,我们只需要移除 -Prefix-free 即可,都不需要修改CSS代码。
简介
-prefix-free 是一个?JavaScript
?工具库,你只要在网页引入这个插件即可,无需任何配置和函数调用,-prefix-free在幕后工作,将当前浏览器的前缀添加到任何CSS代码中。
特征
- 在网页解析的过程中,自动给样式表
<link>
和<style>
内的元素添加一个浏览器厂商CSS3前缀。 - 过程元素的一个风格属性和增加供应商前缀在需要的地方。
- 兼顾新的
<link>
或<style>
元素,style属性的变化而变化(requires plugin) - 让jQuery的
css()
,方法获取和设置属性(requires plugin)
局限性
- 前缀代码在?
@import-ed
?文件中不支持 - 前缀跨来源链接的样式表是不支持的
- 无前缀的链接样式表不工作局部在Chrome和Opera。
- 没有前缀价值观在内联样式,不支持IE 和 Firefox 3.6 版本以下的浏览器。
如何使用
在页面中引入?prefixfree.js
?建议把它放在样式表的后面。
<script src="http://leaverou.github.com/prefixfree/prefixfree.min.js"></script>
然后你就可以在你的网页中、Style文件里面尽情的编写你的CSS代码,无需担心浏览器兼容问题,另外jQuery的?.css()
?方法也会自动补上浏览器前缀,让响应的浏览器支持该CSS3属性,使用非常之轻松惬意。prefixfree.min.js 的用途
相关链接
- Github地址:https://github.com/LeaVerou/prefixfree?有一些API函数可供使用
- 项目地址:https://www.wenjiangs.com/wp-content/uploads/2017/06/prefixfree/
文章来源:https://blog.csdn.net/sunyctf/article/details/134905909
本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。 如若内容造成侵权/违法违规/事实不符,请联系我的编程经验分享网邮箱:veading@qq.com进行投诉反馈,一经查实,立即删除!
本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。 如若内容造成侵权/违法违规/事实不符,请联系我的编程经验分享网邮箱:veading@qq.com进行投诉反馈,一经查实,立即删除!