1.background:linear-gradient(20deg/(to) bottom right,orange,red,hsl(60,100%,50%));

2.-webkit-chrome/safari

-o-opera

-ms-IE9

exclude "to""at"

a fallback

3.backround:radial-gradient(circle closest/farthest-side/corner (at) 100px 200 px,yellow,green);

4.Color stop

background: linear-gradient(135deg, hsl(36,100%,50%) 10%, hsl(72,100%,50%) 60%, white 90%);

5.Repeating gradients

background: repeating-linear-gradient(white, black 10px, white 20px);
background: repeating-linear-gradient(white, black 10px, white 20px);
 

【CSS3】Advanced10:Gradient的更多相关文章

  1. 【CSS3】Advanced3:Universal, Child, and Adjacent Selectors

    1.Universal selectors eg:#target*{ } 2.Child selectors < something immediately nested within some ...

  2. 【CSS3】Advanced11:Media Queries

    1.Browser-size specific CSS @media screen and (max/min-width:1000px){} 2.Orientation-specific CSS? @ ...

  3. 【CSS3】Advanced9:Transformation

    1.transform:rotate(-10deg) skew(20deg,10deg) scaling(2/1,2) translate/移动(100px,200px) 2.transform:ma ...

  4. 【CSS3】Advanced8:CSS Backgrounds: Multiples, Size, and Origin

    1.Multiples,Size,and Origin eg:background-image:url(bg.png),url(bullet.png) 0 50% no-repeat,url(arro ...

  5. 【CSS3】Advanced7:CSS Transitions

    1.animate parts of your design without the need for the likes of JavaScrip 2.allowing smooth animati ...

  6. 【CSS3】Advanced6:Attribute Selectors

    1.with the attribute abbr[title]{color:red} 2.with the attribute and it's value input[type=text][dis ...

  7. 【CSS3】Advanced5:At Rules:@import, @media, and @font-face

    1.@import bolt another stylesheet onto your existing one. @import url(**.css); must be placed at the ...

  8. 【CSS3】Advanced4:Advanced Colors

    1.rgba(red,green,blue,alpha(不透明度0.0(完全透明)与 1.0(完全不透明)) 2.HSLa(hue(色调 0red 120green 240blue),saturati ...

  9. 【CSS3】Advanced2:Shadows

    1.Box Shadows box-shadow:h-shadow v-shadow [blur模糊距离 spread阴影尺寸 color inset]; 2. Text Shadows text-s ...

随机推荐

  1. Yii表单模型使用及以数组形式提交表单数据

    按Yii文档里的描述,Yii在处理表单的一般过程是: 创建表单对应的模型类,设置字段验证规则 创建表单提交对应的action,处理提交的内容 在视图中创建表单form 在刚刚的一个小项目里,想使用aj ...

  2. redis 安装注意事项

    redis安装 1.redis 安装 官网地址:http://redis.io/download $ wget http://download.redis.io/releases/redis-3.0. ...

  3. javascript获取url中对应参数的方法

    利用正则表达式和location.search方法,可以简便的获取到对应的参数:   function getQueryString(name) {var reg = new RegExp(" ...

  4. python log 层次结构

    文件结构 - run.py - b -- __init__.py run.py import logging import b log = logging.getLogger("" ...

  5. Python设计模式——工厂方法模式(FactoryMethod)

    需求:有一个学雷锋活动,有买米和扫地两个内容,参与的人有大学生和社区志愿者,他们各自的方法不一样. 如果用简单工厂模式实现: #encoding=utf-8 __author__ = 'kevinlu ...

  6. C语言字符知识狭区

    C语言字符在用户接口软件编程上经常用到,但是有一些狭区会让编程出现一些小BUG,现在总结与此. 1.'\\' 代表的是字符\,而'\'是不能代表字符\的.通常\后面都要跟上数字或者其他字母来表示一个特 ...

  7. Oracle job procedure

    Oracle job procedure 存储过程定时任务 oracle job有定时执行的功能,可以在指定的时间点或每天的某个时间点自行执行任务. 一.查询系统中的job,可以查询视图 --相关视图 ...

  8. 【转】IO - 同步,异步,阻塞,非阻塞 (亡羊补牢篇)

    概念很重要,一定要掌握.实践都是基于它们的哟 ~~~~~~~~~~~~~~~~~ http://blog.csdn.net/historyasamirror/article/details/57783 ...

  9. HDU4515+计算日期

    模拟! /* 计算过了D天后的日期 之前D天的日期 */ #include<stdio.h> int judge_year( int year ){ ==&&year%!= ...

  10. easyui源码翻译1.32--Draggable(拖动)

    前言 使用$.fn.draggable.defaults重写默认值对象.下载该插件翻译源码 源码 /** * jQuery EasyUI 1.3.2 * *翻译:qq 1364386878 --拖动 ...