CSS3制作的一款按钮特效
/*.btn {
width:230px;
height:70px;
font-size:70px;
font-weight:bold;
overflow:hidden;
font: "Helvetica Neue", Arial, Helvetica, Geneva, sans-serif;
margin: 50px auto;
}
.btn ul {
margin-top:-5px;
margin-left:-45px;
}
.btn ul li {
float: left;
list-style-type:none;
}
.btn ul li:hover .top {
margin-top: -76px;
}
.btn ul li a {
display: block;
background: #000;
color: #fff;
height: 75px;
width: 230px;
text-decoration: none;
text-align:center;
-webkit-transition: margin .4s ease-in-out;
}
.btn ul li .top {
background: #e70f23;
color: #fff;
}*/
<!--<div class ="btn">
<ul>
<li>
<a href="#" class="top">home</a>
<a href="#">emoh</a>
</li>
</ul>
</div>-->
CSS3制作的一款按钮特效的更多相关文章
- 一款纯css3实现的鼠标经过按钮特效
今天再给大家带来一款纯css3实现的鼠标经过按钮特效.这款按钮非常简单,但效果很好,非常漂亮.一起看下效果图: 在线预览 源码下载 实现的代码. html代码: <div align=&qu ...
- BonBon - 使用 CSS3 制作甜美的糖果按钮
BonBon 是一组使用 CSS3 制作的甜美的糖果按钮样式.在过去,我们都是使用图片或者 JavaScript 来实现漂亮的按钮效果,随着越来越多的浏览器对 CSS3 的支持和完善,使用 CSS3 ...
- 网页特效:用CSS3制作3D图片立方体旋转特效
<!DOCTYPE html> <html> <head> <meta charset="utf-8" /> <title&g ...
- css3实现的鼠标经过按钮特效
今天要为各网友再带来一款css实现的鼠标经过按钮的特效.按钮初始时,边框为断开的按钮,当鼠标经过按钮时动画变为封闭的边框.效果图如下: 在线预览 源码下载 我们一起看下实现的代码: html代码: ...
- CSS3制作3D水晶糖果按钮
本人仿照20个漂亮 CSS3 按钮效果及优秀的制作教程中的BonBon(Candy)Button实现了其棒棒糖果按钮,如下图所示: 在线演示地址见here. 使用完全使用CSS实现,无需JS.源码如下 ...
- css3制作一个漂亮的按钮
aaarticlea/png;base64,iVBORw0KGgoAAAANSUhEUgAAAFMAAAA4CAIAAAAO41POAAAGWklEQVRogeWabWwTdRzH/8EwMb6Q69
- css3动画特效:纯css3制作win8加载动画特效
Windows 8 完整效果如上图:这个里面可能是css冲突,喜欢的可以自己去体征一下: css特效代码: <style type="text/css"> ...
- 用CSS3制作尖角标签按钮样式
如图的效果.标签有背景色,且左侧有一个三角形,三角形中间有个白色的圆圈. 你一定在想这个效果是背景图切出来的吧——答案是没有用到任何图片 那你会不会在想这个效果的html结构很复杂呢——答案是最简单的 ...
- 制作3D图片立方体旋转特效
<!DOCTYPE html><html><head><meta charset="utf-8" /><title>CS ...
随机推荐
- CF-805D
D. Minimum number of steps time limit per test 1 second memory limit per test 256 megabytes input st ...
- linux常用命令的全拼
Linux常用命令英文全称与中文解释Linux系统 Linux常用命令英文全称与中文解释linux系统 man: Manual 意思是手册,可以用这个命令查询其他命令的用法. pwd:Print ...
- CodeForces 586D【BFS】
题意: s是这个人开始位置:连续相同大写字母是 Each of the k trains,相应的火车具有相应的字母: '.' 代表空: 有个人在最左列,上面有连续字母代表的火车,火车从左边出去的话,会 ...
- bzoj 2007: [Noi2010]海拔【最小割+dijskstra】
上来就跑3e5的最大流--脑子抽了 很容易看出,每个地方的海拔都是0或1因为再高了没有意义,又,上去下来再上去没有意义,所以最后一定是从s连着一片0,剩下连着t一片1,然后有贡献的就是01交接的那些边 ...
- suse 11.4添加阿里源
感谢SilenMark 作者,让我找到了一个可用的suse 国内源. 大家直接使用root 用户执行以下命令,添加阿里源 zypper addrepo -f http://mirrors.aliyun ...
- 从MySQL高可用引出对高可用架构设计的一些思考
高可用HA(High Availability)是分布式系统架构设计中必须考虑的因素之一,它通常是指,通过设计减少系统不能提供服务的时间. 假设系统一直能够提供服务,我们说系统的可用性是100%.如果 ...
- SNMP4J 总结
一.SNMP4J介绍 SNMP4J是一个用Java来实现SNMP(简单网络管理协议)协议的开源项目.它支持以命令行的形式进行管理与响应.SNMP4J是纯面向对象设计与SNMP++(用C++实现SNMP ...
- HDU 3117 Fibonacci Numbers 数学
http://acm.hdu.edu.cn/showproblem.php?pid=3117 fib是有一个数学公式的. 这里的是标准的fib公式 那么fib = 1 / sqrt(5) * ((1 ...
- 用Eclipse 开发Dynamic Web Project应用程序
一.创建Server通过菜单选择File > New > Other>Server,创建Server,如下图所示. 二.创建Dynamic Web Project项目 1.菜单选择F ...
- html 手机端click 事件延迟问题(fastclick.js使用方法)
下载地址: fastclick.js 为什么存在延迟? 从点击屏幕上的元素到触发元素的 click 事件,移动浏览器会有大约 300 毫秒的等待时间.为什么这么设计呢? 因为它想看看你是不是要进行双击 ...