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 ...
随机推荐
- mysql server安装(windows)
1 在 https://dev.mysql.com/downloads/mysql/ 上下载mysql压缩包 2 解压,并把bin目录加入环境变量 3 初始化,完成后会在mysql根目录下生成data ...
- easyui更改messager的OkCancel按钮为(中文)确定取消
jquery-easyui默认情况下,消息框的按钮文字是英文的OK Cancel,但可以通过提供的方法进行修改,如: $.extend($.messager.defaults,{ ok:" ...
- 《剑指offer》面试题16—反转链表
Node* p1 p2 p3 思路:开始时,p1为NULL,p2=phead,p3=p2—>next.使p2—>next = p1,然后使p1=p2,p2=p3.如果只有1个结点则此时 ...
- 打造个人IP: 开源项目网站构建框架
前言 您是否正在寻找有关如何创建博客网站: 个人博客 或者 开源项目官网 : Dubbo, Vue.js的构建框架? 在这篇文章我将向您展示如何创建一个美观并且实用的开源博客/开源项目官网构建框架!近 ...
- 求N!的长度【数学】
转自:http://blog.csdn.net/fengdian29147001/article/details/11992755 给一个数X,len=log10(X)+1就是X这个数的长度 ①:当N ...
- android摄像头获取图像——第二弹
使用android内的Camera对象 (1)Camera是控制着摄像头的api,拥有一系列控制摄像头的上层方法:camera类能够调用底层的摄像头接口,完成启动摄像头.预 览摄像头图像.拍照等功能: ...
- CTP Release() 的注意问题
测试时发现CThostFtdcMdSpi有个比较严重的问题,就是使用Release()退出清理对象时 会出现死机,并且频率很高,怎样解决? 答:请参考以下代码的释放顺序. template <c ...
- StringUitl工具类中的一种写法
typeHandlersPackageArray = StringUtils.tokenizeToStringArray(this.typeAliasesPackage, ",; \t\n& ...
- bzoj3427:[POI2013]BAJ-Bytecomputer
传送门 很显然有一个结论:最大不过1,最小不过-1 然后dp,设\(f[i][j]\)为满足前\(i\)个不下降,当前放的是\(j-2\),转移就比较好想了 具体方程看代码吧,终于有一个自己会写的题了 ...
- Java EE规范下载