如何让button点一下凹进去效果

最新推荐文章于 2022-05-07 14:46:55 发布
最新推荐文章于 2022-05-07 14:46:55 发布
阅读量1.4w 收藏 4
点赞数 2
分类专栏： HTML+CSS+DIV 文章标签： button border xhtml class html css
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/make1828/article/details/6253133
版权

<!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>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<title>用css把a链接模拟成button的样子</title>
<style type="text/css">
<!--
*{font-size:12px;}
a.button:link {      
       padding:3px 6px 2px 8px;
       border:2px outset #ffffff;
       cursor:pointer;
       background-color: #d4d0c8;
       text-align:center;
       height:12px;
       text-decoration: none;
       color: #000000;
       display:inline-block;
       clear:both;      
}
a.button:visited {      
       padding:3px 6px 2px 8px;
       border:2px outset #ffffff;
       cursor:pointer;
       background-color: #d4d0c8;
       text-align:center;
       height:12px;
       text-decoration: none;
       color: #000000;
       display:inline-block;
       clear:both;      
}
a.button:hover {      
       padding:3px 6px 2px 8px;
       border:2px outset #ffffff;
    cursor:pointer;
       background-color: #d4d0c8;
       text-align:center;
       height:12px;
       text-decoration: none;
       color: #0000FF;
       display:inline-block;
       clear:both;      
}
a.button:active {      
       padding:3px 6px 2px 8px;
       border:2px inset;
       cursor:pointer;
       background-color: #d4d0c8;
       text-align:center;
       height:12px;
       text-decoration: none;
       color: #999999;
       display:inline-block;
       clear:both;      
}
-->
</style>
</head>
<body>
<a href="http://blog.sqlsky.com" class="button">菩提树下的杨过</a>&nbsp;<a href="#" class="button">链接模拟的按钮</a>&nbsp;<button style="height:21px">真正的按钮</button>
</body>
</html>

make1828
关注
  • 2
    点赞
  • 踩
  • 4
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
专栏目录
前端新拟态UI风格按钮，button按钮点击凹陷效果
只会div的博客
01-28 1491
新拟态代码实现 复制以下代码运行查看效果 <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8" /> <title>Document</title> <style> .button { display: flex; align-items: center; just
html 按钮凹进效果图,CSS凹型导航按钮 - 谢小宝
weixin_42104181的博客
06-04 567
一般需求，圆角看起来更加舒服，但是下面直角略显生硬于是设计师有了下面的需求，下面加上小凹型：凹型？凹型？凹型？有点变态，这怎么实现...........图片肯定是最先考虑到的，CSS实现有貌似有一定难度.......别怕，咋们遇难而上，go go...先上html结构，这个很简单,没什么可以说明的：css凹型导航导航1导航2导航3导航4再看CSS#nav {background: #fff;bor...
通过C#实现按钮的凸显凹陷
02-09
通过C#中的WPF编程实现按钮的凸显凹陷作用，使按钮变得更漂亮，是界面变得更炫
BitmapEffect位图效果是简单的像素处理操作。它可以呈现下面几种特殊效果。
杨航的专栏
11-07 1579
BitmapEffect位图效果是简单的像素处理操作。它可以呈现下面几种特殊效果。              BevelBitmapEffect        凹凸效果             BlurBitmapEffect         模糊效果             DropShadowBitmapEffect投影效果             EmbossBitmapEffect
winform 凹进去的button
weixin_30457465的博客
09-22 556
如果是工具栏按钮的话，可以设置CheckState属性为CheckState.Checked，这样就是按下状态了如果是普通按钮的话，有两种方法一种是系统提供的，在工具箱上右键，【选择项】，然后在【COM组件】里找到Microsoft Form 2.0 ToggleButton，勾选上确定以后工具箱里就多了一个控件，这个控件能满足你的需要第二种方法就是自己重写一下，设计一个扩展控件，也不难 转载于:...
超炫button按钮动画效果
03-16
本文将深入探讨如何实现“超炫button按钮动画效果”以及相关的Activity切换动画，让您的应用界面更具吸引力。 首先，让我们关注按钮动画。在Android中，我们可以使用多种方法来创建动画，如属性动画（Property ...
html实现的几款button效果
11-04
<button><i class="fa fa-heart"></i> 点赞</button> ``` 同时，可以使用CSS定义按钮的边框、填充、阴影等样式： ```css button { border: 1px solid #ccc; padding: 10px 20px; font-size: 16px; border-radius...
Android中的Button自定义点击效果实例代码
09-05
Button button = (Button) this.findViewById(R.id.button); button.setOnTouchListener(new View.OnTouchListener() { @Override public boolean onTouch(View v, MotionEvent event) { if (event.getAction() =...
JS button按钮实现submit按钮提交效果
01-19
然而form表单的 submit 且一旦提交则全部提交，所以想到的实现方法就是 使用button实现,代码实现见如下： form设置： <form method=”post” name=”linkform”> 隐藏的act方法设置,代码如下: <input ...
Android点击Button实现切换点击图片效果的示例
08-26
Android 点击 Button 实现切换...通过本示例，我们可以学习到 Button 的基本属性、Selector 文件的使用、Drawable 文件的使用、Button 的点击事件处理、RelativeLayout 的使用、图片的切换效果和逻辑的处理等知识点。
C# WinForm 应用 凹凸效果按键
08-28
采用Button的FlatStyle实现的具有凹凸效果的按键，即当按键时采用切换图片的来凹凸效果，给人一种视觉错位的感觉。（效果不是很理想。图片是用VS自带的绘图工具绘制的） 本程序采用VS2010进行编译。
WinForm Button按钮美化
Scarlett的博客
06-25 4145
原来的效果： 去掉边框 Button属性里找到FlatStyle属性：设置为“Flat” FlatStyle是处理边框的样式 Properties——Appearance——FlatStyle——Flat FlatAppearance是用来设置边框的颜色,宽度和鼠标移动和点击时的效果 Properties——Appearance——FlatAppearance——BorderSize：将默认的1改为0，此时按钮将无边框 设置背景颜色 最终效果： ...
android中按钮凹下去,实现按钮的点击效果
weixin_39804603的博客
05-26 586
不多说，直接进入正题：1、新建一个Android Application Project2、在res文件夹中放入几个精心挑选或是经过PS处理的按钮图片(用PS处理保存时，最好保存为同样大小的图片，这样能让点击时的凹凸效果更加逼真),存放在drawable-hdpi即可(假定放两张图片，分别为q1,q2)3、新建一个xml文件，具体设定详见附件一图片(先将其命名为selector_01)4、点开刚新...
MFC单击按钮，按钮凹下，再次单击按钮弹起来
tajon1226的专栏
05-07 890
这个可以拖动checkbox，添加变量的类名是CMFCButton即可
PyQt5 按钮事件 信号与槽
HHT0506的博客
02-09 868
示例 import sys from PyQt5.QtWidgets import QMainWindow, QApplication, QPushButton class MainWindow(QMainWindow): def __init__(self, parent=None): super(MainWindow, self).__init__(parent) self.resize(400, 250)#窗口大小 self.setWindo
python之Button组件
why404
11-17 4638
Button（按钮）用来执行用户的单击操作。 Button 可以包含文本，也可以包含图像。 按钮被单击后会自动调用对应事件绑定的方法。 """ 测试Button """ from tkinter import * from tkinter import messagebox class Application(Frame): """一个经典的GUI程序的写法""" def _...
MFC--按键、按钮按下和弹起事件检测
热门推荐
随心漂流的博客
09-24 1万+
MFC按钮按下事件很容易实现，为一个按钮直接添加点击事件即可，但是有时需要检测按钮的抬起，即按钮的按下和抬起单独实现各自的功能时，就需要对两种状态单独检测。下面把MFC按钮和键盘的按下和抬起一起实现。 方法是重写**PreTranslateMessage(MSG* pMsg)*函数： 步骤： 1.新建一个对话框MFC工程，名称自主定义即可 2.添加一个按钮，ID默认为IDC_BUTTON1，不需更...
android button点击阴影效果
最新发布
08-09
在Android中，Button控件默认的点击效果是产生一个阴影。这个阴影效果可以在Button的XML文件中通过设置Button的属性来调整。 要修改Button点击阴影效果，可以通过在Button的XML文件中设置相关属性来实现。首先，在Button的XML文件中找到Button控件的声明代码。在Button控件的属性中，可以找到“android:elevation”属性，该属性用于设置Button的阴影大小和高度。通过调整这个属性的值，可以改变Button的点击阴影效果。 此外，还可以使用“android:stateListAnimator”属性来定义Button在不同状态下的动画效果。默认情况下，Button的点击阴影效果是一个立体的阴影动画。可以通过在XML文件中定义一个新的stateListAnimator，然后将这个新的stateListAnimator属性赋值给Button的“android:stateListAnimator”属性，来改变Button的点击阴影效果。 例如，可以在Button的XML文件中添加以下代码来改变Button的点击阴影效果： ``` <Button android:id="@+id/button" android:layout_width="wrap_content" android:layout_height="wrap_content" android:text="Click Me" android:elevation="8dp" android:stateListAnimator="@anim/button_anim" /> ``` 其中，android:elevation的值为8dp，这会使Button产生一个较大的阴影效果。并且，通过设置android:stateListAnimator属性为一个自定义动画文件button_anim，来改变Button在点击时的阴影动画效果。 总之，通过调整Button的android:elevation属性和android:stateListAnimator属性，可以改变Button控件的点击阴影效果。
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值