本文主要是介绍background的复合写法:图片、渐变色、纯色,希望对大家解决编程问题提供一定的参考价值,需要的开发者们随着小编来一起学习吧!
background
的复合写法可以使用逗号分隔多个属性值,每个属性值对应不同的背景层。对于将背景设置为图片、渐变色和纯色叠加在一起的情况,可以使用以下写法:
background: url(../../../img/huayin/newsBg@2x.png) no-repeat 100% 100%/54px 50px, linear-gradient(38deg, #FFFFFF 0%, #F3F4FF 100%), #fff;
这个写法中,首先使用url()
函数指了一个图片背景层,图片路径为…/…/…/img/huayin/newsBg@2x.png
,且设置了no-repeat
属性,表示不重复平铺图片,使用100% 100%指定了背景图片的位置,使用54px 50px
指定了背景图片的大小。然后使用linear-gradient()
函数定义了一个线性渐变背景层,角度为38度,颜色从白色(#FFFFFF)
渐变到淡紫色(#F3F4FF)
。最后使用#fff
设置了一个纯色背景层。
这篇关于background的复合写法:图片、渐变色、纯色的文章就介绍到这儿,希望我们推荐的文章对编程师们有所帮助!