1、style样式

<style type="text/css">
.demok3_input {
transition: all 0.30s ease-in-out;
-webkit-transition: all 0.30s ease-in-out;
-moz-transition: all 0.30s ease-in-out;
border: #35a5e5 1px solid;
border-radius: 3px;
outline: none;
} .demok3_input:focus {
box-shadow: 0 0 5px rgba(81, 203, 238, 1);
-webkit-box-shadow: 0 0 5px rgba(81, 203, 238, 1);
-moz-box-shadow: 0 0 5px rgba(81, 203, 238, 1);
} .demok3_a {
text-decoration: none;
-webkit-transition: all linear 0.30s;
-moz-transition: all linear 0.30s;
transition: all linear 0.30s;
background: rgba(81, 203, 238, 1);
color: white;
padding: 6px 25px 6px 25px;
font: 12px '微软雅黑';
border-radius: 3px;
} .demok3_a:hover {
background: rgba(39, 154, 187, 1);
}
</style>

2、html

<input class="demok3_input" type="text" placeholder="用户名或邮件地址"  style="height: 25px"/>
<input class="demok3_input" type="password" placeholder="请输入密码" style="height: 25px"/>
<a class="demok3_a" href="#">登陆</a>

演示结果:

css3 input边框蓝光特效的更多相关文章

  1. CSS3实现边框线条动画特效

    <div class="box-line"></div> CSS代码 .box-line, .box-line::before, .box-line::af ...

  2. 6种炫酷的CSS3按钮边框动画特效

    6种炫酷的CSS3按钮边框动画特效Button border animate 用鼠标滑过下面的按钮看看效果! Draw Draw Meet Center Spin Spin Circle Spin T ...

  3. 27.给input边框和背景颜色设置全透明

    给input边框和背景颜色设置全透明,但是里面的字不会消失 1.让背景颜色变透明(二选一) background-color:rgba(0,0,0,0); background:rgba(0,0,0, ...

  4. 12种炫酷HTML5 SVG和CSS3表单浮动标签特效

    这是一组效果非常炫酷的HTML5 SVG和CSS3表单浮动标签特效.这组浮动标签特效共12种效果,使用SVG和CSS3来制作完成.这些浮动标签效果部分在元素的伪元素上使用CSS transitions ...

  5. 一款基于css3鼠标经过圆形旋转特效

    今天给大家分享一款基于css3鼠标经过圆形旋转特效.当鼠标经过的时候图片边框颜色旋转,图片显示详情.该实例适用浏览器:IE8.360.FireFox.Chrome.Safari.Opera.傲游.搜狗 ...

  6. CSS3 border-radius边框圆角

    在CSS3中提供了对边框进行圆角设定的支持,可对边框1~4个角进行圆角样式设置. 目录 1. 介绍 2. value值的格式和类型 3. border-radius 1~4个参数说明 4. 在线示例 ...

  7. 纯CSS3实现动态火车行驶特效

    上次开完飞机,这次开火车 查看效果:http://hovertree.com/texiao/css3/7/ 效果图: 代码如下: <!DOCTYPE html> <html> ...

  8. jQuery+CSS3实现404背景动画特效

    效果:http://hovertree.com/texiao/jquery/74/ 源码下载:http://hovertree.com/h/bjaf/ko0gcgw5.htm 效果图如下: 代码如下: ...

  9. Atitit.iso格式蓝光 BDMV 结构说明

    Atitit.iso格式蓝光 BDMV 结构说明 1. Iso是个复合文件1 2. Iso内部格式如下1 2.1. Bdmv文件夹格式 BDMV(Blu-ray Disk Movie.BD-MV),为 ...

随机推荐

  1. MongoDB学习笔记~为IMongoRepository接口添加了增删改方法,针对官方驱动

    回到目录 上一讲说了MongoDB官方驱动的查询功能,这回说一下官方驱动的增删改功能,驱动在升级为2.0后,相应的insert,update和delete都只有了异步版本(或者叫并行版本),这当然也是 ...

  2. 交互式makefile

    之前一直不知道在shell中调用read赋值后,怎么传给makefile中的变量,后来才恍然大悟. myname := $(shell read -p "Enter your name:&q ...

  3. RabbitMQ服务安装配置

    RabbitMQ是流行的开源消息队列系统,是AMQP(Advanced Message Queuing Protocol高级消息队列协议)的标准实现,用erlang语言开发.RabbitMQ据说具有良 ...

  4. shell连接本机虚拟机

    1.设置虚拟机的网络连接模式

  5. 【Windows编程】系列第十一篇:多文档界面框架

    前面我们所举的例子中都是单文档界面框架,也就是说这个窗口里面的客户区就是一个文档界面,可以编写程序在里面输入或者绘制文本和图形输出,但是不能有出现多个文档的情况.比如下面的UltraEdit就是一个典 ...

  6. 【转载、推荐】不要自称是程序员,我十多年的 IT 职场总结

    注评:一气读完后,有些和我的观点类似.这篇文章显然是外国老写的,但是不妨碍我们的跨国交流. 如果我可以给每个工程教育增加一门课,它不会涉及编译器.门电路或是时间复杂度,而是一门介绍行业现实的入门课,因 ...

  7. 怎样用ZBrush对模型进行渲染(二)

    继上节课Fisker老师对ZBrush中对渲染和灯光起到重要作用的Light和LightCap进行了具体讲解之后,本节课继续研究Render(渲染)和Light及LightCap相结合会产生什么样的效 ...

  8. 使用Ecplise git commit时出现"There are no stages files"

    异常   解决方案 进入Window--Preferences--Team--Git--Committing,反选下图红圈部分:   保存后即可出线我们熟悉的提交代码界面啦:

  9. POJ1717 Dominoes[背包DP]

    Dominoes Time Limit: 1000MS   Memory Limit: 65536K Total Submissions: 6731   Accepted: 2234 Descript ...

  10. UVA 10564 Paths through the Hourglass[DP 打印]

    UVA - 10564 Paths through the Hourglass 题意: 要求从第一层走到最下面一层,只能往左下或右下走 问有多少条路径之和刚好等于S? 如果有的话,输出字典序最小的路径 ...