CSS3实现的立体button
<!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的更多相关文章
- 利用纯CSS3实现超立体的3D图片侧翻倾斜效果
原文:利用纯CSS3实现超立体的3D图片侧翻倾斜效果 上午的时候我在jQuery论坛上看到网友分享的一款CSS3 3D图片侧翻倾斜特效,觉得效果非常棒,其实话说回来,这玩意儿的实现真的非常简单,主要是 ...
- CSS3制作404立体字体
CSS3制作404立体字体页面效果 鼠标移动上去,背景色变白. 动态效果: .demo p:first-child span:hover { text-shadow:0px ...
- 纯CSS3实现超立体的3D图片侧翻倾斜效果
看到网友分享的一款CSS3 3D图片侧翻倾斜特效,觉得效果非常棒,其实话说回来,这玩意儿的实现真的非常简单,主要是创意不错.先来看看效果图.那么接下来我们分析一下源码吧,显示html代码,非常简单: ...
- CSS3特效----制作立体导航栏菜单
使用CSS3实现下图的导航菜单效果 <!doctype html> <html lang="en"> <head> <meta chars ...
- CSS3去除手机浏览器button点击出现的高亮框
在工作中常常遇到在手机浏览器中浏览网页时.点击页面中的button或者是具备点击事件的元素,就会出现一个默认的高亮框.影响总体的感官体验. 能够用一个简单的css3属性来解决:tap-highligh ...
- css3实现3D立体翻转效果
1.在IE下无法显示翻转效果,火狐和谷歌可以 /*样式css*/ .nav-menu li { display: inline; } .nav-menu li a { color: #fff; dis ...
- HTML5 与 CSS3 jQuery部分知识总结
一. HTML5 为什么需要HTML5 什么是HTML5 HTML5现状及浏览器支持 HTML5优点与缺点 HTML5语法规则与文档声明 HTML5新增表达标签 HTML5多媒体组件 HTML5 ...
- HTML5 与 CSS3 jQuery部分知识总结【转】
一. HTML5 为什么需要HTML5 什么是HTML5 HTML5现状及浏览器支持 HTML5优点与缺点 HTML5语法规则与文档声明 HTML5新增表达标签 HTML5多媒体组件 HTML5 ...
- 无需图片,使用CSS3实现圆角按钮[转]
首先来看看效果: 事例HTML代码: <a href="#" class="button green">button</a> < ...
随机推荐
- WPF 布局控件 之 DockPanel
DockPanel为容器控件 主要了解其Dock属性和LastChildFill属性的使用 一.LastChildFill="True" 时 代码: <DockPanel L ...
- .Net中常用的几种ActionResult
1.ViewResult 表示一个视图结果,它根据视图模板产生应答内容.对应得Controller方法为View. 2.PartialViewResult 表示一个部分视图结果,与ViewResult ...
- JS排序的运用
排序是一个非常实用的功能,队列也是一样实用. 有时候项目中就是会用到它. 举个例子,队列的运用,比如刷小礼物,接收方,会受到很多用户的礼物.为了公平起见,要一个个的显示出礼物效果.这个时候就需要队列了 ...
- IIS7下设置AD单点登录
简介:IIS7下设置AD单点登录 1.选中网站,双击“身份验证”: 2.启用“Window身份验证”.禁用“匿名身份验证”.启用“基本身份验证”: 3.在“基本身份验证”上面点右键,选择“编辑”,输入 ...
- EF搭建数据库
http://blog.csdn.net/mss359681091/article/details/52135867http://blog.csdn.net/x_craft/article/detai ...
- 2229: [Zjoi2011]最小割(最小割树)
Description 小白在图论课上学到了一个新的概念——最小割,下课后小白在笔记本上写下了如下这段话: “对于一个图,某个对图中结点的划分将图中所有结点分成两个部分,如果结点s,t不在同一个部分中 ...
- Ansible学习记录二:命令
0.ansible 命令参数详解: [root@localhost ~]# ansible Usage: ansible <host-pattern> [options] Options: ...
- Linux 时区的修改
Linux 时区的修改 1. CentOS和Ubuntu的时区文件是/etc/localtime,但是在CentOS7以后localtime以及变成了一个链接文件 ``` [root@centos7 ...
- gdb x查看二进制
参考 http://blog.csdn.net/allenlinrui/article/details/5964046 (gdb) disassemble main Dump of assembler ...
- 项目EasyUi和JS中遇到的问题总汇
近期因为项目用到EasyUi,曾经仅仅是听过,可是没有详细用过.仅仅能一边学一边做.如今将做的过程中遇到的一些难点总结例如以下,以备后用: EsayUi使用: Json格式:key:value,key ...