当前位置:网站首页 > 创业 > 正文

css 线性渐变事例分享

0 张子豪 张子豪 2025-10-12 08:52 1

        比来新进修了css 的渐变常识,固然还没有完全搞懂,可是发现用线性渐变却可以做出不错的布景结果,所以这里分享这个不错的线性渐变事例;

东西/原料

  • 电脑
  • Sublime text 2

方式/步调

  1. 1

    架构很是简单就是一个页面中有一个div,我们用一个div来实现节制布景色,之后在在div实现上布景色渐变;

  2. 2

    这里先节制一下 div 的根基样式,

    宽度, 高度,边框,节制一下文字的位置,文字巨细,还有div在页面中的位置;

  3. 3

    这里的 color:white;

    是为了将字体变为 白色 ,算是为了将文字可以闪现出来,算是做颜色的对比;

  4. 4

    background:linear-gradient(to right,white, 。。。,white)。

    关头的属性设置,显示设置的颜色之间的过度;如图二

    to right,渐变从左边起头;

  5. 5

    然后我们在添加几个颜色代码,记得代码之间要用 逗号 分隔;

    purple ,紫色

    #0000ff,深蓝  #00ffff ,浅蓝 green,绿色;

    如许一个比力花哨的布景就完当作了...

注重事项

  • 仅作分享;

来源:百闻(微信/QQ号:9397569),转载请保留出处和链接!


本文链接:https://www.ibaiwen.com/web/239874.html

张子豪

张子豪

TA很懒,啥都没写...

@百闻娱乐 本站部分内容转自互联网,若有侵权等问题请及时与本站联系,我们将在第一时间删除处理。 | 粤ICP备2024343649号 | (地图