前段时间由于手机项目需要实现一个背景渐变功能，  开始是想切个小背景图平铺下，  后来想到css3可以实现，如是用下面的代码就实现了。
.sec_case_list li  span{ background:linear-gradient(bottom, #000, transparent); background:-webkit-linear-gradient(bottom, #000, transparent); background:-moz-linear-gradient(bottom, #000, transparent);   display:block;padding:0.3125rem 0;width:100%;position:absolute;left:0;bottom:0;}

移动开发之css3实现背景渐变效果的更多相关文章

  1. 移动开发之css3实现背景几种渐变效果

    移动端背景渐变,非常的年轻,符合90后年轻一代的审美,css3的这个渐变目前主要是应用在手机前端领域. 产品设计中使用渐变色的好处:1:观众不至于眼睛过于疲劳(如果是浅色背景,3个小时下来极容易造成观 ...

  2. 桌面应用开发之WPF动态背景

      因为项目需要,在WPF开发的桌面应用中,登陆页面需使用动态背景.由于没有前端开发人员,所以由半吊子的后端开发人员根据效果图写前端xaml.去掉页面上边框,抽离动态背景设置代码: <Windo ...

  3. 高效开发之SASS篇 灵异留白事件——图片下方无故留白 你会用::before、::after吗 link 与 @import之对比 学习前端前必知的——HTTP协议详解 深入了解——CSS3新增属性 菜鸟进阶——grunt $(#form :input)与$(#form input)的区别

    高效开发之SASS篇   作为通往前端大神之路的普通的一只学鸟,最近接触了一样稍微高逼格一点的神器,特与大家分享~ 他是谁? 作为前端开发人员,你肯定对css很熟悉,但是你知道css可以自定义吗?大家 ...

  4. 第七十九，CSS3背景渐变效果

    CSS3背景渐变效果 学习要点: 1.线性渐变 2.径向渐变 本章主要探讨HTML5中CSS3背景渐变功能,主要有两种渐变方式:线性渐变和径向 (放射性)渐变. 一．线性渐变 linear-gradi ...

  5. DarkStone - 跨平台移动应用开发之 Flex 的崛起

    我的好友Ds 发布一个flex的消息.我帮忙转发 DarkStone - 跨平台移动应用开发之 Flex 的崛起 (2013-08-20 22:28:32)     此文章由 周戈 (DarkSton ...

  6. 谷歌插件Image downloader开发之popup

    Image downloader的交互逻辑是这样的:用户点击Image downloader的图标,会向页面(content script,见上一篇文章:谷歌插件Image downloader开发之 ...

  7. iOS开发之UISearchBar初探

    iOS开发之UISearchBar初探 UISearchBar也是iOS开发常用控件之一,点进去看看里面的属性barStyle.text.placeholder等等.但是这些属性显然不足矣满足我们的开 ...

  8. CSS3实现背景颜色渐变

    CSS3渐变色生成网站:http://gradients.glrzad.com/ 本文参考:前端设计之用CSS3做线性渐变效果http://webskys.com/css3/10.html 在CSS3 ...

  9. Android开发之PopupWindow

      /* *  Android开发之PopupWindow * *  Created on: 2011-8-8 *  Author: blueeagle *  Email: liujiaxiang@g ...

随机推荐

  1. WebSocket 与 HTTP/2

    个人笔记 WebSocket WebSocket 是一个双向通信协议,它在握手阶段采用 HTTP/1.1 协议(暂时不支持 HTTP/2). 握手过程如下: 首先客户端向服务端发起一个特殊的 HTTP ...

  2. Week1 Team Homework #1 from Z.XML-对于学长项目《shield star》的思考和看法

    试用了一下学长黄杨等人开发的<shield star>游戏.                      其实作为一个学弟,我对cocos2d-x引擎还算是比较了解,所以对于这样一款很“典型 ...

  3. 打包成exe程序

    https://blog.csdn.net/harvic880925/article/details/27675073 当然针对这种exe文件,也可以解压出来得到具体的debug文件夹下的内容.

  4. 【bzoj2764】[JLOI2011]基因补全 dp+高精度

    题目描述 在生物课中我们学过,碱基组成了DNA(脱氧核糖核酸),他们分别可以用大写字母A,C,T,G表示,其中A总与T配对,C总与G配对.两个碱基序列能相互匹配,当且仅当它们等长,并且任意相同位置的碱 ...

  5. 【bzoj1263】[SCOI2006]整数划分 高精度

    题目描述 从文件中读入一个正整数n(10≤n≤31000).要求将n写成若干个正整数之和,并且使这些正整数的乘积最大. 例如,n=13,则当n表示为4+3+3+3(或2+2+3+3+3)时,乘积=10 ...

  6. fzu 2246(ac 自动机)

    fzu 2246(ac 自动机) 题意: 某一天YellowStar学习了AC自动机,可以解决多模式匹配问题.YellowStart当然不会满足于此,它想进行更深入的研究. YellowStart有一 ...

  7. 解决Vue方法中setTimeout改变变量的值无效

    把data里的变量继承过来重新封装一下 let that = this; this.rightAnswer = false; setTimeout(function() { that.rightAns ...

  8. HDU 5655 四边形判断

    CA Loves Stick Time Limit: 2000/1000 MS (Java/Others)    Memory Limit: 262144/262144 K (Java/Others) ...

  9. weblogic的安装和注意的问题以及在idea怎么用weblogic启动一个web服务

    第一步下载weblogic: 大家可以通过我的网盘下载weblogic,地址如下 https://pan.baidu.com/s/1NkZ_Gd-xfim5YGcdtjYoUw 第二步安装weblog ...

  10. TCP ------ TCP创建服务器中出现的套接字

    在服务器端,socket()返回的套接字用于监听(listen)和接受(accept)客户端的连接请求.这个套接字不能用于与客户端之间发送和接收数据. accept()接受一个客户端的连接请求,并返回 ...