秀米吧 关注:2,695贴子:9,826
  • 8回复贴,共1

#百里大叔聊秀米 【如何利用渐变背景色变更背景图的露出】

只看楼主收藏回复



IP属地:江苏1楼2021-01-15 15:46回复
    通常背景图的露出都是方方正正,但是通过渐变背景色的调整,可以实现背景图的部分露出。那么具体是怎么实现的呢?


    IP属地:江苏2楼2021-01-15 15:47
    回复
      2026-01-05 11:11:15
      广告
      不感兴趣
      开通SVIP免广告
      ①首先我们先搭建一个基础布局,并设置背景图


      IP属地:江苏3楼2021-01-15 15:47
      回复
        ②然后在背景图布局中,我们再插入一个新的基础布局,选择新布局的背景色为渐变色


        IP属地:江苏4楼2021-01-15 15:48
        回复
          ③根据自己需求设计自己所需要的渐变色代码,其重点在于角度、位置以及颜色


          IP属地:江苏5楼2021-01-15 15:48
          回复
            百里大叔以稿件中展示的渐变色代码为例,本稿所采用的渐变色代码如下:
            linear-gradient(160deg, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0) 30%, rgb(32, 104, 163) 30%, rgb(32, 104, 163) 70%, rgb(255, 255, 255) 70%, rgb(255, 255, 255) 100%)。


            IP属地:江苏6楼2021-01-15 15:48
            回复
              其中deg代表的是渐变色的角度,百分比代表的颜色的位置,譬如rgb(32, 104, 163) 30%, rgb(32, 104, 163) 70%的意思就是深蓝色(rgb(32, 104, 163))从30%一直到70%。


              IP属地:江苏7楼2021-01-15 15:48
              回复
                其中有一个特殊的颜色 透明色,真正意义上透明色算不上颜色,它其实是把任一一种颜色透明度调到最高,体现在rgba就是第四个数值为0。透明色能让后面的背景图露出,通过调整渐变色背景色的角度,可以实现背景图的部分露出。


                IP属地:江苏8楼2021-01-15 15:48
                回复
                  2026-01-05 11:05:15
                  广告
                  不感兴趣
                  开通SVIP免广告
                  欢迎关注百里大叔的秀米主页https://xiumi.us/#/u/3Ek2n,并点击关注,让我们一同学习秀米。


                  IP属地:江苏9楼2021-01-15 15:49
                  回复