/*.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制作的一款按钮特效的更多相关文章

  1. 一款纯css3实现的鼠标经过按钮特效

    今天再给大家带来一款纯css3实现的鼠标经过按钮特效.这款按钮非常简单,但效果很好,非常漂亮.一起看下效果图: 在线预览   源码下载 实现的代码. html代码: <div align=&qu ...

  2. BonBon - 使用 CSS3 制作甜美的糖果按钮

    BonBon 是一组使用 CSS3 制作的甜美的糖果按钮样式.在过去,我们都是使用图片或者 JavaScript 来实现漂亮的按钮效果,随着越来越多的浏览器对 CSS3 的支持和完善,使用 CSS3 ...

  3. 网页特效:用CSS3制作3D图片立方体旋转特效

    <!DOCTYPE html> <html> <head> <meta charset="utf-8" /> <title&g ...

  4. css3实现的鼠标经过按钮特效

    今天要为各网友再带来一款css实现的鼠标经过按钮的特效.按钮初始时,边框为断开的按钮,当鼠标经过按钮时动画变为封闭的边框.效果图如下: 在线预览   源码下载 我们一起看下实现的代码: html代码: ...

  5. CSS3制作3D水晶糖果按钮

    本人仿照20个漂亮 CSS3 按钮效果及优秀的制作教程中的BonBon(Candy)Button实现了其棒棒糖果按钮,如下图所示: 在线演示地址见here. 使用完全使用CSS实现,无需JS.源码如下 ...

  6. css3制作一个漂亮的按钮

    aaarticlea/png;base64,iVBORw0KGgoAAAANSUhEUgAAAFMAAAA4CAIAAAAO41POAAAGWklEQVRogeWabWwTdRzH/8EwMb6Q69

  7. css3动画特效:纯css3制作win8加载动画特效

    Windows 8     完整效果如上图:这个里面可能是css冲突,喜欢的可以自己去体征一下:   css特效代码: <style type="text/css"> ...

  8. 用CSS3制作尖角标签按钮样式

    如图的效果.标签有背景色,且左侧有一个三角形,三角形中间有个白色的圆圈. 你一定在想这个效果是背景图切出来的吧——答案是没有用到任何图片 那你会不会在想这个效果的html结构很复杂呢——答案是最简单的 ...

  9. 制作3D图片立方体旋转特效

    <!DOCTYPE html><html><head><meta charset="utf-8" /><title>CS ...

随机推荐

  1. mysql server安装(windows)

    1 在 https://dev.mysql.com/downloads/mysql/ 上下载mysql压缩包 2 解压,并把bin目录加入环境变量 3 初始化,完成后会在mysql根目录下生成data ...

  2. easyui更改messager的OkCancel按钮为(中文)确定取消

    jquery-easyui默认情况下,消息框的按钮文字是英文的OK  Cancel,但可以通过提供的方法进行修改,如: $.extend($.messager.defaults,{ ok:" ...

  3. 《剑指offer》面试题16—反转链表

    Node* p1  p2  p3 思路:开始时,p1为NULL,p2=phead,p3=p2—>next.使p2—>next = p1,然后使p1=p2,p2=p3.如果只有1个结点则此时 ...

  4. 打造个人IP: 开源项目网站构建框架

    前言 您是否正在寻找有关如何创建博客网站: 个人博客 或者 开源项目官网 : Dubbo, Vue.js的构建框架? 在这篇文章我将向您展示如何创建一个美观并且实用的开源博客/开源项目官网构建框架!近 ...

  5. 求N!的长度【数学】

    转自:http://blog.csdn.net/fengdian29147001/article/details/11992755 给一个数X,len=log10(X)+1就是X这个数的长度 ①:当N ...

  6. android摄像头获取图像——第二弹

    使用android内的Camera对象 (1)Camera是控制着摄像头的api,拥有一系列控制摄像头的上层方法:camera类能够调用底层的摄像头接口,完成启动摄像头.预 览摄像头图像.拍照等功能: ...

  7. CTP Release() 的注意问题

    测试时发现CThostFtdcMdSpi有个比较严重的问题,就是使用Release()退出清理对象时 会出现死机,并且频率很高,怎样解决? 答:请参考以下代码的释放顺序. template <c ...

  8. StringUitl工具类中的一种写法

    typeHandlersPackageArray = StringUtils.tokenizeToStringArray(this.typeAliasesPackage, ",; \t\n& ...

  9. bzoj3427:[POI2013]BAJ-Bytecomputer

    传送门 很显然有一个结论:最大不过1,最小不过-1 然后dp,设\(f[i][j]\)为满足前\(i\)个不下降,当前放的是\(j-2\),转移就比较好想了 具体方程看代码吧,终于有一个自己会写的题了 ...

  10. Java EE规范下载