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. javascript学习笔记2

    二.下列哪些变量是不正确的  说明原因 var a1; var b1 = 3; c1 ='good'; var d1 = c1 = e1;   ×  连等必须赋值 var g1 = 'hei' goo ...

  2. lamp环境centos5.10,phpprotobuf模块安装,及简单应用

    ==相关参考== rpm包 http://rpmfind.net/linux/rpm2html/ Linux rpm 命令参数使用详解[介绍和应用] phpize学习 http://blog.sina ...

  3. Nginx禁止通过IP,未绑定域名访问服务器

    这几天查看CNZZ统计后台看到,我的IP被两个未知的域名绑定了,为了避免被天朝和谐掉, 可以在Nginx上设置禁止通过IP访问服务器,只能通过绑定域名访问(同时设置未绑定域名返回500错误或者跳转到我 ...

  4. js实现完美身份证号有效性验证

    最近需要对身份证合法性进行验证,实名验证是不指望了,不过原来的验证规则太过简单,只是简单的验证了身份证长度,现在业务需要加强下身份证验证规则,网上找到了不少资料,不过都不合偶的心意,无奈只好直接写一个 ...

  5. Oracle OEM重建

    参考博客:http://blog.csdn.net/tianlesoftware/article/details/4702978 测试环境: C:\Users\Administrator>sql ...

  6. 基于C#的SolidWorks插件开发(1)--SolidWorks API接口介绍

    这是两年前毕业时写的一篇关于SolidWorks插件开发与公司PDM集成的毕业设计,最近闲来无事拿出来整理一下,大神们可以略过. 1.1   SolidWorks API接口 正确调用SolidWor ...

  7. .NET 轻量级 ORM 框架 - Dapper 介绍

    Dapper简单介绍: Dapper is a single file you can drop in to your project that will extend your IDbConnect ...

  8. 自动寻路NavMesh

    步骤 1.创建地形 2.添加角色 3.创建多个障碍物,尽量摆放的复杂些,用来检测NavMesh的可用性和效率 4.选中地形,在Navigation窗口中,设置Navigation Static 5.依 ...

  9. dos下的edit命令使用详解

    dos下的edit命令使用详解 来源:网络 作者:未知 edit命令是一个简单的编辑软件,我们经常用它来编辑一些程序和批处理文件. 比如,我想在c盘根目录下编辑一个简单的批处理文件,要求无论当前盘和当 ...

  10. Eclipse 启动问题:'Initilizing Java Tooling' has encountered a problem(。。。)

    一.问题描述: . 二.分析及解决 ...