渐变色
--线性渐变 linear-gradient
#bg {
width: 100%;
background: -webkit-linear-gradient(#9f1c65, #d89068,#7d1467,#ffe66c); /* Safari 5.1 - 6.0 */
background: -o-linear-gradient(#9f1c65, #d89068,#7d1467,#ffe66c); /* Opera 11.1 - 12.0 */
background: -moz-linear-gradient(#9f1c65, #d89068,#7d1467,#ffe66c); /* Firefox 3.6 - 15 */
background: linear-gradient(#9f1c65, #d89068,#7d1467,#ffe66c); /* 标准的语法 */
}

外发光

box-shadow
@-webkit-keyframes
@-webkit-keyframes shineRed {
from {
-webkit-box-shadow: 0 0 5px #bbb;
}
50% {
-webkit-box-shadow: 0 0 10px red;
}
to {
-webkit-box-shadow: 0 0 5px #bbb;
}
}
.shine_red {
-webkit-animation-name: shineRed;
-webkit-animation-duration: 3s;
-webkit-animation-iteration-count: infinite;
} <div class="shine_red" style="width:500px; height:100px; margin:0 auto"></div>

CSS3 外发光 渐变色的更多相关文章

  1. 关于CSS3背景渐变色无效问题

    无效的css[linear-gradient]写法 .loginbox{ background-color: linear-gradient(#D0D0D0, #E0E0E0, white); wid ...

  2. css3背景渐变色代码

    从上到下 #grad {  background: -webkit-linear-gradient(red, blue);  background: -o-linear-gradient(red, b ...

  3. css3实现颜色渐变以及兼容性处理

    有时我们会看到网站上的一些图片是渐变色的,这些图片有的是ui设计出来的,有的则是直接通过css3制作出来的.下面就讲一下css3实现渐变色的方法,以及在各个浏览器上的兼容性. CSS3 Gradien ...

  4. 推荐7款新鲜出炉的HTML5/CSS3应用

    1.HTML5/CSS3发光文字可自定义文字色彩效果很赞 要分享的这款HTML5/CSS3文字效果很帅,鼠标滑过文字时,文字会出现发光的特效,并且我们可以自定义文字和颜色. 在线演示 源码下载 2.H ...

  5. 精选10款超酷的HTML5/CSS3菜单

    今天向大家精选了10款超酷的HTML5/CSS3菜单,给你的网页添加不一样的精彩,一起来围观一下吧. 1.CSS3手风琴菜单 下拉展开带弹性动画 利用CSS3技术可以实现各种各样的网页菜单,我们之前也 ...

  6. HTML5与CSS3权威指南之CSS3学习记录

    title: HTML5与CSS3权威指南之CSS3学习记录 toc: true date: 2018-10-14 00:06:09 学习资料--<HTML5与CSS3权威指南>(第3版) ...

  7. 如何使用IconFont字体图标代替网页图片?

    一.IconFont的优点 1.轻量性 可以减少http请求,可以配合html5离线存储做性能优化,有利于后期维护. 2.灵活性 可以自由变换IconFont大小(不失真),可以修改IconFont颜 ...

  8. Web中的图标

    随着时代的变迁与技术的不断的更新,在当今这个时代,Web中的图标(Icons)不再仅仅是局限于<img>.除了<img>直接调用Icons文件之外,还有Sprites(俗称雪碧 ...

  9. Bootstrap框架中的字形图标的理解

    最近项目中准备使用 Bootstrap 框架,看中了Ace Admin 这套皮肤,看其代码的时候,发现使用了字形图标.下面内容来源于网络,根据自己对新知识的学习曲线重新整合了一下: 一,字形图标的定义 ...

随机推荐

  1. ts 格式化日期输出

    功能 像C#中DateTime的ToString的格式化输出一样,在js/ts中输出格式化的日期字符串 网上很多正则的,不加分隔符就不行了,和C#的格式也不一样 刚接触js/ts没两月,可能会有问题. ...

  2. 顺序表java实现

    public class SeqList { Object[] data; int maxSize; int length; public SeqList(int maxSize) { this.ma ...

  3. javascript学习

    代码放在E:\JS\js学习 学习中要学会多查手册 javascript基本介绍 js是用于web开发的脚本语言. 后面统称为 js 脚本语言是什么? 脚本语言不能独立使用,它和html/jsp/ph ...

  4. python面向对象初级(七)

    概述 面向过程:根据业务逻辑从上到下写垒代码 函数式:将某功能代码封装到函数中,日后便无需重复编写,仅调用函数即可 面向对象:对函数进行分类和封装,让开发“更快更好更强...” 面向过程编程最易被初学 ...

  5. Zabbix3 agent端安装(二)

    1.基础环境准备 安装zabbix的yum源,这里有必要提一点,阿里的yum源已经提供了zabbix3.0 1.1.yum源配置 rpm -ihv http://mirrors.aliyun.com/ ...

  6. React开发入门

    目录: 一.前言 二.什么是React 三.开发环境搭建 四.预备知识 五.最简单的React小程序 六.基础语法介绍 七.总结 八.参考资料   一.前言 近段时间看到学长公司招聘React Nat ...

  7. Html:form表单

    1:onsubmit 事件:会在表单中的确认按钮被点击时发生. <form action="" method="post" name="form ...

  8. 【转】 解读EOF

    解读EOF 标签: fplinuxc语言filestream 2012-01-31 22:05 439人阅读 评论(0) 收藏 举报  分类: C.C++_程序设计(20)  我学习C语言的时候,遇到 ...

  9. [译]merge vs rebase

    git rebase和git merge设计的初衷是解决相同的一件事, 即把一个分支合并到另外一个分支--只是他们两个处理的方式非常不一样. 当你在一个特定的分支开发新功能, 团队的其它成员在mast ...

  10. 兼容IE6的min-width、min-height

    如果一个站是宽屏的,你左右拖动浏览器的窗口网站宽度会随着窗口的大小而改变,而浏览器窗口宽度减小到一定程度后就会出现下边的滚动条,网站宽度就不会再减小了,我们知道这一简单的功能用css的min-widt ...