链接状态的按钮 html,css中按钮的四种状态

css中按钮有四种状态

1. 普通状态

2. hover 鼠标悬停状态

3. active 点击状态

4. focus 取得焦点状态

.btn:focus{outline:0;} 可以去除按钮或a标签点击后的蓝色边框

下面的例子中.btn1用focus按钮会按下，不弹起

.btn2用active按钮点击按下，会弹起

Save Settings

Submit

.btn{

appearance: none;

background: #026aa7;

color: #fff;

font-size: 20px;

padding: 0.65em 1em;

border-radius: 4px;

box-shadow: inset 0 -4px 0 0 rgba(0,0,0,0.2);

margin-right: 1em;

cursor: pointer;

border:;

}

.btn1:hover{

box-shadow: inset 0 -4px 0 0 rgba(0,0,0,0.6), 0 0 8px 0 rgba(0,0,0,0.5);

}

.btn1:focus{

position: relative;

top: 4px;

box-shadow: inset 0 3px 5px 0 rgba(0,0,0, 0.2);

outline:;

}

.btn2:hover{

box-shadow: inset 0 -4px 0 0 rgba(0,0,0,0.6), 0 0 8px 0 rgba(0,0,0,0.5);

}

.btn2:active{

position: relative;

top: 4px;

box-shadow: inset 0 3px 5px 0 rgba(0,0,0,0.2);

outline:;

}

.btn2:focus{

outline:;

}

css中图片的四种地址引用

URL: CSS中四种引用图片asset的方式:

HTML5样式和列表、CSS链接的四种状态

一.HTML5样式 1.标签:

ccs中a链接的四种状态

什么是超链接? 超链接通俗地指从一个网页指向一个目标的连接关系,这个目标可以是另一个网页,也可以是相同网页上的不同位置,还可以是一个图片,一个电子邮件地址,一个文件,甚至是一个应用程序.而在一个网页中 ...

CSS控制a标签链接的四种状态

/*CSS链接的四种状态 *a:link 普通的.未被访问的链接样式 *a:visited 用户已访问的链接样式 *a:hover 鼠标指针位于链接上方样式 *a:active 链接被点击的时刻样式 ...

>hibernate的四种状态

hibernate的四种状态 1.临时状态 与数据库中没有相对应的数据,也不在session的管理之中,一般是新new出来的对象 2.持久化状态 对象在session的管理中,最后会在事务提交后,在数 ...

Hibernate的session缓存和对象的四种状态

一.session缓存 说session缓存就得说到JAVA对象的生命周期,当没有任何引用指向一个对象时,对象则可以被gc回收,也就是生命周期结束了 而hibernate获取一个对象后,会将对象存入s ...

java线程四种状态

一个线程可以有四种状态: 1.新(new), 即线程刚刚创建,而并未执行 2.可运行(runnable),意味着一旦时间分片机制有空闲的CPU周期提供给一个线程,那个线程便可立即开始运行.因此,线程可 ...

java核心知识点学习----并发和并行的区别,进程和线程的区别,如何创建线程和线程的四种状态,什么是线程计时器

多线程并发就像是内功,框架都像是外功,内功不足,外功也难得精要. 1.进程和线程的区别 一个程序至少有一个进程,一个进程至少有一个线程. 用工厂来比喻就是,一个工厂可以生产不同种类的产品,操作系统就是 ...

Android按钮的四种点击事件

本文记录一下按钮的四种点击事件 第一种 public class MainActivity extends Activity { @Override protected void onCreate(B ...

随机推荐

Atitit.ide eclipse编译速度慢的解决

Atitit.ide eclipse编译速度慢的解决 以为是jar的体积与数量,貌似无关.. Err java的数量,貌似无关 Java的数量,关系不大... 最终原因:show>>pro ...

《Objective-C编程》部分示例

部分示例 最近在看顺带实现了书中部分示例代码.如果感兴趣可以自行 下载(点我). 通过本书大致了解了Objectiv ...

BZOJ3726 : PA2014Final Wykladzina

从上到下枚举下底边,维护$a[i]$表示$i$向上延伸多少距离里面没有坏点,$b[i]$表示$i$向上延伸多少距离里面最多只有1个坏点. 设$l0[i],r0[i]$表示以$a[i]$为最小值,往左往 ...

Homebrew

Homebrew官网:http://brew.sh Homebrew installs the stuff you need that Apple didn't Homebrew的安装非常简单,打开终 ...

C\C++ 框架和库整理(转)

[本文系外部转贴,原文地址:http://coolshell.info/c/c++/2014/12/13/c-open-project.htm]留作存档 下次造轮子前先看看现有的轮子吧 值得学习的C语 ...

显式参数 VS 隐式参数

尽量使用显示参数,而不是隐式参数,看下面实例代码. 示例1采用显示参数,示例2采用隐式参数.对于一个不熟悉MonitorManager内部构造的调用者来说,在构造MonitorManager的时候,对 ...

cimge 这次能够图片大小尺寸

CImage imSrc,imDest;imSrc.Load(……);//读入原始图片imDest.Create(……)//创建新大小的图片imSrc.StretchBlt(imDest.GetDC( ...

C# Path

http://hi.baidu.com/mayijun0410/item/4fa6c6c154a1c35ebdef69f9 using System.IO; Path类的静态方法: ChangeExt ...

ANDROID_MARS学习笔记_S05_001_用SensorManager获取传感器

1. public void onCreate(Bundle savedInstanceState) { super.onCreate(savedInstanceState); setContentV ...

MVC5 Entity Framework学习之Entity Framework高级功能

在之前的文章中,你已经学习了怎样实现每一个层次结构一个表继承. 本节中你将学习使用Entity Framework Code First来开发ASP.NET web应用程序时能够利用的高级功能. 在本 ...