<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml">

<head>

<title>CSS3实现的立体button</title>

<meta http-equiv="content-type" content="text/html;charset=gb2312">

<!--[if IE]>

<script src="http://html5shiv.googlecode.com/svn/trunk/html5.js"></script>

<![endif]-->

<style type="text/css">

article,aside,figure,footer,header,hgroup,menu,nav,section{display:block;}

a{background-color:#DB5705;border-radius:8px 8px 8px 8px;box-shadow:0 9px 0 #DB1F05,0 9px 25px rgba(0,0,0,0.7);color:#FFFFFF;display:block;font-family:'微软雅黑';font-size:42px;font-weight:700;margin:100px auto;padding:4px;position:relative;text-align:center;text-decoration:none;transition:all
0.1s ease 0s;width:260px;}

a:active{box-shadow:0 3px 0 #DB1F05,0 3px 6px rgba(0,0,0,0.9);position:relative;top:6px;}

</style>

</head>

<body>

<div><A href="http://www.999jiujiu.com/">http://www.999jiujiu.com/</A></div>

<a href="#">前端project师</a>

</body>

</html>

CSS3实现的立体button的更多相关文章

  1. 利用纯CSS3实现超立体的3D图片侧翻倾斜效果

    原文:利用纯CSS3实现超立体的3D图片侧翻倾斜效果 上午的时候我在jQuery论坛上看到网友分享的一款CSS3 3D图片侧翻倾斜特效,觉得效果非常棒,其实话说回来,这玩意儿的实现真的非常简单,主要是 ...

  2. CSS3制作404立体字体

    CSS3制作404立体字体页面效果     鼠标移动上去,背景色变白.       动态效果:     .demo p:first-child span:hover { text-shadow:0px ...

  3. 纯CSS3实现超立体的3D图片侧翻倾斜效果

    看到网友分享的一款CSS3 3D图片侧翻倾斜特效,觉得效果非常棒,其实话说回来,这玩意儿的实现真的非常简单,主要是创意不错.先来看看效果图.那么接下来我们分析一下源码吧,显示html代码,非常简单: ...

  4. CSS3特效----制作立体导航栏菜单

    使用CSS3实现下图的导航菜单效果 <!doctype html> <html lang="en"> <head> <meta chars ...

  5. CSS3去除手机浏览器button点击出现的高亮框

    在工作中常常遇到在手机浏览器中浏览网页时.点击页面中的button或者是具备点击事件的元素,就会出现一个默认的高亮框.影响总体的感官体验. 能够用一个简单的css3属性来解决:tap-highligh ...

  6. css3实现3D立体翻转效果

    1.在IE下无法显示翻转效果,火狐和谷歌可以 /*样式css*/ .nav-menu li { display: inline; } .nav-menu li a { color: #fff; dis ...

  7. HTML5 与 CSS3 jQuery部分知识总结

    一.    HTML5 为什么需要HTML5 什么是HTML5 HTML5现状及浏览器支持 HTML5优点与缺点 HTML5语法规则与文档声明 HTML5新增表达标签 HTML5多媒体组件 HTML5 ...

  8. HTML5 与 CSS3 jQuery部分知识总结【转】

    一.    HTML5 为什么需要HTML5 什么是HTML5 HTML5现状及浏览器支持 HTML5优点与缺点 HTML5语法规则与文档声明 HTML5新增表达标签 HTML5多媒体组件 HTML5 ...

  9. 无需图片,使用CSS3实现圆角按钮[转]

    首先来看看效果:   事例HTML代码: <a href="#" class="button green">button</a> < ...

随机推荐

  1. WPF 布局控件 之 DockPanel

    DockPanel为容器控件 主要了解其Dock属性和LastChildFill属性的使用 一.LastChildFill="True" 时 代码: <DockPanel L ...

  2. .Net中常用的几种ActionResult

    1.ViewResult 表示一个视图结果,它根据视图模板产生应答内容.对应得Controller方法为View. 2.PartialViewResult 表示一个部分视图结果,与ViewResult ...

  3. JS排序的运用

    排序是一个非常实用的功能,队列也是一样实用. 有时候项目中就是会用到它. 举个例子,队列的运用,比如刷小礼物,接收方,会受到很多用户的礼物.为了公平起见,要一个个的显示出礼物效果.这个时候就需要队列了 ...

  4. IIS7下设置AD单点登录

    简介:IIS7下设置AD单点登录 1.选中网站,双击“身份验证”: 2.启用“Window身份验证”.禁用“匿名身份验证”.启用“基本身份验证”: 3.在“基本身份验证”上面点右键,选择“编辑”,输入 ...

  5. EF搭建数据库

    http://blog.csdn.net/mss359681091/article/details/52135867http://blog.csdn.net/x_craft/article/detai ...

  6. 2229: [Zjoi2011]最小割(最小割树)

    Description 小白在图论课上学到了一个新的概念——最小割,下课后小白在笔记本上写下了如下这段话: “对于一个图,某个对图中结点的划分将图中所有结点分成两个部分,如果结点s,t不在同一个部分中 ...

  7. Ansible学习记录二:命令

    0.ansible 命令参数详解: [root@localhost ~]# ansible Usage: ansible <host-pattern> [options] Options: ...

  8. Linux 时区的修改

    Linux 时区的修改 1. CentOS和Ubuntu的时区文件是/etc/localtime,但是在CentOS7以后localtime以及变成了一个链接文件 ``` [root@centos7 ...

  9. gdb x查看二进制

    参考 http://blog.csdn.net/allenlinrui/article/details/5964046 (gdb) disassemble main Dump of assembler ...

  10. 项目EasyUi和JS中遇到的问题总汇

    近期因为项目用到EasyUi,曾经仅仅是听过,可是没有详细用过.仅仅能一边学一边做.如今将做的过程中遇到的一些难点总结例如以下,以备后用: EsayUi使用: Json格式:key:value,key ...