成都网站建设设计

将想法与焦点和您一起共享

css背景函数cross-fade()有什么用

小编给大家分享一下css背景函数cross-fade()有什么用,相信大部分人都还不怎么了解,因此分享这篇文章给大家参考一下,希望大家阅读完这篇文章后大有收获,下面让我们一起去了解一下吧!

杜集网站制作公司哪家好,找创新互联!从网页设计、网站建设、微信开发、APP开发、响应式网站开发等网站项目制作,到程序开发,运营维护。创新互联公司2013年成立到现在10年的时间,我们拥有了丰富的建站经验和运维经验,来保证我们的工作的顺利进行。专注于网站建设就选创新互联。

cross-fade()

cross-fade用于在两张叠加的背景图片上施加透明度。用法如下

background-image: -webkit-cross-fade(url('./bg1x.png'),url('./bg2x.png'),70%);

css背景函数cross-fade()有什么用

前面两个参数为图片的资源位置,后面一个需要传入百分比,表示透明度,这个透明度是相对于最后那张图片的,比如,当百分比为0%时,此时应该只显示第一张图片

css背景函数cross-fade()有什么用

当百分比为100%时,只显示第二张图片。

css背景函数cross-fade()有什么用

这个属性,在firefox中完全不兼容,在chrome和safari中兼容性要好太多

css背景函数cross-fade()有什么用

以上是“css背景函数cross-fade()有什么用”这篇文章的所有内容,感谢各位的阅读!相信大家都有了一定的了解,希望分享的内容对大家有所帮助,如果还想学习更多知识,欢迎关注创新互联行业资讯频道!


文章标题:css背景函数cross-fade()有什么用
文章出自:http://chengdu.cdxwcx.cn/article/iesgsg.html