简单的CSS外阴影按钮
来源：互联网 发布：企业阿里云邮登录 编辑：程序博客网 时间：2024/05/17 06:06
简单的CSS外阴影按钮
新手制造
按前：
![[1]](http://img.blog.csdn.net/20141230230955740?watermark/2/text/aHR0cDovL2Jsb2cuY3Nkbi5uZXQvc3Zvd3dj/font/5a6L5L2T/fontsize/400/fill/I0JBQkFCMA==/dissolve/70/gravity/Center)
按后：
![[2]](http://img.blog.csdn.net/20141230231313578?watermark/2/text/aHR0cDovL2Jsb2cuY3Nkbi5uZXQvc3Zvd3dj/font/5a6L5L2T/fontsize/400/fill/I0JBQkFCMA==/dissolve/70/gravity/Center)
代码：
<html><head><meta charset="utf-8"/><title>CSS3.0 外阴影按钮</title><style type="text/css">body{margin-top:50px;margin-left:50px;}#button{text-align:center;width:80px;height:30px;border:1px solid #000;box-shadow:2px 2px 2px 2px;cursor:Pointer;}</style></head><body><div id="button" onmousedown="DOWN()" onmouseup="UP()" onmouseleave="UP()">我是按钮</div></body><script>function $(id){return document.getElementById(id);}function DOWN(){$("button").style.marginTop="2px";$("button").style.marginLeft="2px";$("button").style.boxShadow="1px 1px 2px 2px";}function UP(){$("button").style.marginTop="0px";$("button").style.marginLeft="0px";$("button").style.boxShadow="2px 2px 2px 2px";}</script></html> 0 0
- 简单的CSS外阴影按钮
- 兼容IE的内阴影和外阴影效果
- css3在工作中运用上的总结(圆角、内阴影、外阴影)
- 边框、内阴影、背景图片、背景颜色、外阴影的呈现级别
- WPF 让Border显示外阴影
- css 简单的点击按钮更换展示的图片
- CSS做的按钮
- css漂亮的按钮
- 好看的CSS按钮
- 正点CSS实例--简单链接按钮
- css3 box-shadow 内阴影与外阴影
- css3 box-shadow阴影(外阴影与外发光)讲解
- css3 box-shadow阴影(外阴影与外发光)讲解
- 一个简单的按钮
- 简单的按钮样式
- 简单的单选多选按钮
- 简单的按钮贴图
- 简单的倒计时按钮
- jquery中的AJAX使用--与原始ajax的比较
- 懒人邮件群发日发50-100万封不打码不换IP不需发件箱大站协议系统营销软件100%进收件箱
- CentOS6.5 mysql5.6 启动错误 server PID file could not be found
- 通什翡翠商城大站协议邮件群发系统日发20-30万封不打码不换ip不需发件箱100%进收件箱
- 漫谈程序员系列：千奇百怪的程序员
- 简单的CSS外阴影按钮
- MySQL自学篇（八）
- Python菜鸟学习手册08----面向对象的基本概念
- 利用存储过程进行表数据分离的案例分享
- Swift-函数、方法
- error: command 'x86_64-linux-gnu-gcc' failed with exit status 1
- 解决Android studio中使用vitamio出现UnsatisfiedLinkError异常的问题
- 谈谈如何在面试中发掘程序员的核心竞争力
- [leetcode 49] Anagrams
