博客
关于我
强烈建议你试试无所不能的chatGPT,快点击我
CSS3背景线性渐变
阅读量:6939 次
发布时间:2019-06-27

本文共 856 字,大约阅读时间需要 2 分钟。

5.背景线性渐变:background-gradient

(1)linear:线性渐变,

谷歌浏览器:(webkit)

background:-webkit-gradient(linear ,0 0,0 80% , from(#fff),  to(#000));(水平渐变)

background:-webkit-gradient(linear ,0 0, 80% 0 , from(#fff),  to(#000));(垂直渐变)

background:-webkit-gradient(linear ,0 0, 300 300 , from(orangeed),  to(blue));(成斜线渐变)

火狐浏览器:

background:-moz-linear-gradient(left , #fff , #000 );颜色渐变是从右到左(黑-白)

background:-moz-linear-gradient(right , #fff , #000 );颜色渐变是从左到右(黑-白)

background:-moz-linear-gradient(top , #fff , #000 );颜色是从下到上渐变(黑-白)

background:-moz-linear-gradient(top ,right , #fff , #000);颜色从下到上,从左到右(黑-白)

(2)环形渐变:

background:radial-gradient(circle , #fff , #ffo , #080);(circle值100px , 100px一样时为圆)

background:radial-gradient(ellipse , #fff , #ffo , #080);(ellipse值为100px , 50px不一样时为椭圆)

代表渐变的图形效果(图形或者椭圆形),可以使用英文或者坐标点

转载于:https://www.cnblogs.com/SummerBreezeYHC/p/7076495.html

你可能感兴趣的文章
Angular CLI 常用命令
查看>>
Nginx的安装和配置
查看>>
mysql 5.6.27 rpm 安装
查看>>
Android Studio 创建项目常见问题
查看>>
在主机用ssh连接vitualbox虚拟机 nat端口转发 ssh连接
查看>>
Google Map For Android
查看>>
【转载】Hibernate3注解
查看>>
IN和EXISTS的详解
查看>>
在Mac上安装EA
查看>>
kmalloc详解
查看>>
Jquery 实现 微博,消息向上滚动
查看>>
Redis(一)——NoSQL入门和概述
查看>>
我为什么不看好 PHP 发展 ?
查看>>
使用jquery jcrop插件进行图片的截取与保存
查看>>
Spring Boot学习笔记-MVC
查看>>
Java身份证号码验证
查看>>
利用docker搭建php7和nginx运行环境的全过程
查看>>
C语言中的const和指针
查看>>
SpringMVC3.0.5+Spring3.0.5+MyBatis3.0.4全注解实例详解(一)
查看>>
[有效]Hibernate之deleted object would be re-saved by cascade 异常的解决
查看>>