zoukankan      html  css  js  c++  java
  • CSS linear-gradient() 函数

    用于背景颜色渐变或画线条等场景

    linear-gradient() 函数用于创建一个表示两种或多种颜色线性渐变的图片。

    创建一个线性渐变,需要指定两种颜色,还可以实现不同方向(指定为一个角度)的渐变效果,如果不指定方向,默认从下到上渐变。

    /* 从上到下,蓝色渐变到红色 */
    linear-gradient(blue, red);
     
    /* 渐变轴为45度,从蓝色渐变到红色 */
    linear-gradient(45deg, blue, red);
     
    /* 从右下到左上、从蓝色渐变到红色 */
    linear-gradient(to left top, blue, red);
     
    /* 从下到上,从蓝色开始渐变、到高度40%位置是绿色渐变开始、最后以红色结束 */
    linear-gradient(0deg, blue, green 40%, red);

    /* 从右下角到左上角方向渐变 */
    background-image: -moz-linear-gradient( -45deg, rgb(149,112,241) 0%, rgb(101,143,243) 100%);
    background-image: -webkit-linear-gradient( -45deg, rgb(149,112,241) 0%, rgb(101,143,243) 100%);
    background-image: -ms-linear-gradient( -45deg, rgb(149,112,241) 0%, rgb(101,143,243) 100%);

    从X轴正方向逆时针为正方向,顺时针为负deg

    https://www.runoob.com/cssref/func-linear-gradient.html

  • 相关阅读:
    移动端web
    递归求和
    json的基础了解
    冒泡排序的编程方法
    js面向对象
    1002,javascript的原型属性
    1001,instanceof关键字以及typeof关键字
    19,简述一下src与href的区别(不懂)
    531,<form>action属性
    530,css outline属性
  • 原文地址:https://www.cnblogs.com/init-007/p/14267523.html
Copyright © 2011-2022 走看看