#grad {
  background: -webkit-linear-gradient(left,rgba(255,0,0,0),rgba(255,0,0,1)); /* Safari 5.1 - 6 */
  background: -o-linear-gradient(right,rgba(255,0,0,0),rgba(255,0,0,1)); /* Opera 11.1 - 12*/
  background: -moz-linear-gradient(right,rgba(255,0,0,0),rgba(255,0,0,1)); /* Firefox 3.6 - 15*/
  background: linear-gradient(to right, rgba(255,0,0,0), rgba(255,0,0,1)); /* 标准的语法 */
}

css3实现背景渐变的更多相关文章

  1. CSS3透明背景+渐变样式

    CSS3透明背景+渐变样式 转载自博文:<CSS3透明背景+渐变样式> http://blog.csdn.net/netbug_nb/article/details/44343809 效果 ...

  2. 关于css3的背景渐变

    关于css3的渐变,目前各大浏览器还未做到很好的支持,所以需要在我们使用时加上各大浏览器前缀. -moz-:使用Mozilla内核的浏览器(Firefox浏览器) -webkit-:使用Webkit内 ...

  3. 笔记 ： CSS3实现背景渐变过渡

    使用CSS3的人都知道背景background-image是可以线性渐变(linear-gradient)和径向渐变(radial-gradient),但是想要做到过渡动画,单纯的background ...

  4. CSS3利用背景渐变和background-size配合完成渐变与条纹效果[持续更新中...]

    1.不等垂直条纹. <!-- 不等垂直条纹 --> <div class="div1"></div>div1 div{ width: 200px ...

  5. CSS3魔法堂：背景渐变（Gradient）

    一.前言 很久之前就了解过CSS3的线性渐变(Linear-Gradient),这段时间决定进一步认知这一特性,以下笔记以便日后查阅. 二.CSS3的各种背景渐变   1. 线性渐变 示例——七彩虹 ...

  6. CSS3背景渐变。。。

    CSS3 Gradient 分为 linear-gradient(线性渐变)和 radial-gradient(径向渐变).而我们今天主要是针对线性渐变来剖析其具体的用法.为了更好的应用 CSS3 G ...

  7. css3实现背景颜色渐变，文字颜色渐变，边框颜色渐变

    css3的渐变可以使用2个或者多个指定的颜色之间显示平稳的过渡的效果.这篇文章主要介绍下css3实现背景颜色渐变,文字颜色渐变,边框颜色渐变的方法,以便大家学习参考! 1.css背景颜色渐变 代码: ...

  8. CSS3背景渐变属性 linear-gradient(线性渐变)和radial-gradient(径向渐变)

    CSS3 Gradient分为linear-gradient(线性渐变)和radial-gradient(径向渐变). 为了更好的应用CSS3 Gradient,我们需要先了解一下目前的几种现代浏览器 ...

  9. CSS3之firefox&safari背景渐变之争 - [前端技术][转]

    Firefox浏览器下的渐变背景  Firefox3.6background:-moz-linear-gradient(top, red, rgba(0, 0, 255, 0.5));chrome/S ...

随机推荐

  1. 初学Python——装饰器

    一.什么是装饰器 当我们做好一个产品之后,需要对它进行不断地维护,对某些函数增加一些功能.这个时候如果去修改源代码将是非常不合适的.(原因:1.原则上已经写好的函数尽量不去修改它,因为一旦修改可能会导 ...

  2. python __call__方法的使用

    介绍一下python __call__ 方法的使用 代码如下: #!/usr/bin/env python # -*- coding: utf- -*- ''' __call__方法 普通的类定义的方 ...

  3. 【P1941】 飞扬的小鸟

    题目描述 游戏界面是一个长为 nn,高为 mm 的二维平面,其中有 kk 个管道(忽略管道的宽度). 小鸟始终在游戏界面内移动.小鸟从游戏界面最左边任意整数高度位置出发,到达游戏界面最右边时,游戏完成 ...

  4. Laravel5：重定向 redirect 函数的详细使用

    Laravel5 中新增了一个函数 redirect() 来代替 Laravel4 中 Redirect::to() 来进行重定向操作.函数 redirect() 可以将用户重定向到不同的页面或动作, ...

  5. Vue文件中引入img 路径写法

    把图片路径写在data里面,然后渲染模板的两种方式 方案1.在data使用require将图片进入,写法如下 logo: require('../asset/admin/logo.png')  在模板 ...

  6. UVA12253 简单加密法 Simple Encryption

    这题到现在还是只有我一个人过?太冷门了吧,毕竟你谷上很少有人会去做往年ACM比赛的题 题面意思很简单,每次给出\(K_1\),让你求一个\(K_2\)满足\(K_1^{K_2}\equiv K_2(\ ...

  7. 深入理解［Master-Worker模式］原理与技术

    Master-Worker模式是常用的并行模式之一.它的核心思想是,系统由两类进程协作工作:Master进程和Worker进程.Master进程负责接收和分配任务,Worker进程负责处理子任务.当各 ...

  8. 初窥RabbitMQ消息中间及SpringBoot整合

    一:RabbitMQ简介 RabbitMQ介绍 RabbitMQ 即一个消息队列,主要是用来实现应用程序的异步和解耦,同时也能起到消息缓冲,消息分发的作用. 消息中间件最主要的作用是解耦,中间件最标准 ...

  9. 提取jedis源码的一致性hash代码作为通用工具类

    一致性Hash热点 一致性Hash算法是来解决热点问题,如果虚拟节点设置过小热点问题仍旧存在. 关于一致性Hash算法的原理我就不说了,网上有很多人提供自己编写的一致性Hash算法的代码示例,我在跑网 ...

  10. 小记Java时间工具类

    小记Java时间工具类 废话不多说,这里主要记录以下几个工具 两个时间只差(Data) 获取时间的格式 格式化时间 返回String 两个时间只差(String) 获取两个时间之间的日期.月份.年份 ...