5去掉button按钮的点击样式

使用box-shadow属性来实现复古按钮的样式

具体代码如下：

<!DOCTYPE html>
<html><head><meta charset="utf-8"><title></title></head><style>.button {outline: none;width: 245px;height: 85px;font-size: 40px;color: #fff;background: #dcc551;border-radius: 25px;cursor: pointer;text-align: center;box-shadow: inset -5px 0px 3px #a9973e,inset 5px 0px 3px #a9973e,inset 0px 5px 3px #eee3ac,inset 0px -5px 3px #6e6228;}</style><body><button class="button"></button></body>
</html>

实现的效果：

这里有明显的1px的边框但为了实现点击的效果不能给去掉。

还需要大牛来指点一下。

5去掉button按钮的点击样式_CSS实现复古按钮相关推荐

button按钮的点击样式解决
button按钮样式开发中使用button的时候点击会出现一个黑的的边框, 当我点击的时候这个按钮就会出现一个黑色的边框 ,即使之前设置边框样式也没用解决方法 : 在css样式中加入 outli ...
如何判断html按钮是否点击,jquery/js如何判断按钮是否被点击？
jquery/js如何判断按钮是否被点击?下面本篇文章给大家介绍一下jq/js判断按钮是否被点击的方法.有一定的参考价值,有需要的朋友可以参考一下,希望对大家有所帮助. 方法1: document.o ...
按钮默认点击事件(打开页面时按钮默认被点击)
setTimeout(function() {// IEif(document.all) {document.getElementById("id名").click();}// 其 ...
5去掉button按钮的点击样式_各种好看的小按钮合集，纯css编写，最近在学习时遇到的，记录成为笔记...
写在前面最近忙着实习的事,前往广州,租房,置办东西等等.用碎片化的时间看了一些博客,也看到不少我认为很不错的通过纯css来打造的按钮样式.记录下来以后开发的时候或许能用上. 亮起来按钮 <di ...
android去掉button默认的点击阴影
查了资料,发现别人都是说加一个style属性. style="?android:attr/borderlessButtonStyle" 加上了确实管用,但是我绝不是不求甚解的人.追 ...
python selenium 点击开始按钮,python selenium-点击页面而不使用next按钮
有人能帮忙解决这个问题吗? 更新:在Robbie W.的帮助下工作.我使用的代码是: options.add_argument('windows-size = 1200 x 800') browser ...
提交按钮css加样式,用CSS美化按钮（button）
? 我们用 A 包含一个 SPAN 标签来实现此效果: HTML: 按钮文字? 设置按钮样式: CSS: ? 为按钮添加点击样式: CSS: ? 由于 IE 下点击后不能还原到默认状态,因此,我们需要 ...
Bootstrap组件——【按钮（预定义样式类、边框颜色、大小、激活和禁用状态、按钮标签）、按钮组（定义按钮组、工具栏按钮组、大小、嵌套按钮、垂直排列）、下拉菜单（定义下拉菜单、下拉菜单样式）】
一.按钮按钮是网页中不可缺少的一种组件,例如页面中搜索.注册等按钮.按钮还广泛应用于表单.下拉菜单.模态框等场景中. 1.预定义样式类 Bootstrap提供了btn来定义按钮,btn ...
【Visual Studio 2019】创建 MFC 桌面程序 ( 安装 MFC 开发组件 | 创建 MFC 应用 | MFC 应用窗口编辑 | 为按钮添加点击事件 | 修改按钮文字 | 打开应用 )
文章目录一.安装 MFC 开发组件二.创建 MFC 应用三.MFC 应用窗口编辑四.为按钮添加点击事件五.修改按钮文字六.打开系统其它应用七.博客源码一.安装 MFC 开发组件打开 ...

5去掉button按钮的点击样式_CSS实现复古按钮

5去掉button按钮的点击样式_CSS实现复古按钮相关推荐

最新文章

热门文章