css3 渐变

CSS3渐变     可以让你在两个或多个指定的颜色之间显示平稳的过渡
  • 线性渐变（linear-gradient）- 向下/向上/向左/向右/对角方向
    • 默认从上向下   background-image: linear-gradient(#e66465, #9198e5)   可多颜色
    • 从左向右    background-image: linear-gradient(to right, red , yellow)   to bottom right 右下角
    • 颜色可用rgba格式，带有透明度
  • 径向渐变（radial-gradient）- 由它们的中心定义
    • 颜色结点均匀分布（默认情况下） background-image: radial-gradient(red, yellow, green)
    • 颜色结点不均匀分布  background-image: radial-gradient(red 5%, yellow 15%, green 60%)
    • circle 表示圆形，ellipse 表示椭圆形  background-image: radial-gradient(circle, red, yellow, green)
posted @ 2020-08-21 21:41  帅气巴巴  阅读(115)  评论(0)  编辑  收藏  举报