可通过使用css伪类实现点击元素变色的效果,两个伪类是:active, :focus

:active

:active选择器用于选择活动链接。当在一个链接上点击时,它就会成为活动的(激活的),:active选择器适用于所有元素,不仅限于链接a元素

:focus

:focus 选择器用于选取获得焦点的元素。仅接收键盘事件或其他用户输入的元素允许 :focus 选择器。

 1.) button:active{
   background:olive;
}
button:focus{
   background:olive;
2.) }

4. css事件的更多相关文章

  1. jquery css事件编程 尺寸设置

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/ ...

  2. jquery css事件编程 位置 操作

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/ ...

  3. css伪类的说明以及使用(css事件)

    CSS伪类的使用(css事件) 转载请注明源地址:http://www.cnblogs.com/funnyzpc/p/7670959.html 之前有开发开发App的时候,有同事问我那个列表的条目按下 ...

  4. 几种鼠标触发CSS事件

    onMouseDown 按下鼠标时触发 onMouseOver 鼠标经过时触发 onMouseUp 按下鼠标松开鼠标时触发 onMouseOut 鼠标移出时触发 onMouseMove 鼠标移动时触发 ...

  5. css事件穿透

    代码: pointer-events: none; 解义:你可以看的到第一个元素,但是你看不到下面的元素着,点击第一个元素会穿透触发到第二个元素的元素

  6. CSS鼠标响应事件经过、移动、点击示例介绍

    本文为大家介绍下CSS 鼠标响应事件:鼠标经过CSS.鼠标移动CSS.鼠标点击CSS以及示例,喜欢的朋友可以参考下   几种鼠标触发CSS事件. 说明: onMouseDown 按下鼠标时触发 onM ...

  7. javascript高级程序设计---CSS操作

    CSS与JavaScript是两个有着明确分工的领域,前者负责页面的视觉效果,后者负责与用户的行为互动.但是,它们毕竟同属网页开发的前端,因此不可避免有着交叉和互相配合. HTML元素的style属性 ...

  8. 8.12 CSS知识点5

    背景原点 background-origin 设置元素背景图片的原始起始位置,必须保证背景是background-repeat为no-repeat此属性才会生效. 语法: background-ori ...

  9. JQuery 事件器的介绍

    基本用法 $(元素). 事件( 事件属性); 常见事件 示例 说明 $(selector).click()  被选元素的点击事件 $(selector).dblclick()  被选元素的双击事件 $ ...

随机推荐

  1. 【笔记3-24】Python语言基础

    环境搭建与语法入门 遇到问题解决问题 积累 英语单词 认真听讲,多敲代码 计算机是什么 计算机的组成 计算机的使用方式 TUI文本交互 GUI图形化交互 windows 的命令行 Shell.Term ...

  2. effective-java学习笔记---优先使用泛型方法30

    泛型类型比需要在客户端代码中强制转换的类型更安全,更易于使用. 当你设计新的类型时,确保它们可以在没有这种强制转换的情况下使用. 这通常意味着使类型泛型化. 如果你有任何现有的类型,应该是泛型的但实际 ...

  3. html之样式

    HTML 样式 1. font字体 font-family 字体样式 比如:微软雅黑.Serif 字体.Sans-serif 字体.Monospace 字体.Cursive 字体.Fantasy 字体 ...

  4. python之路 2020/2/18

    这是第一篇随笔,记录今天的内容,我不知道什么是成功,因为我没有成功过,但是,我想成功一次! python 多练吧! 一.编程语言的分类 机器语言:01001010,高低电平,计算机懂的语言. 汇编语言 ...

  5. spring bean的装载过程简略赏析

    spring一个bean的容器,它从这个最基本的功能进而扩展出AOP,transaction,cache,schedule,data等等,将业务与框架代码解耦,让我们可以将大部分精力投入到业务代码中, ...

  6. flask中的表单文件上传

    在表单中上传文件时,一定要加入 enctype="multipart/form-data" 属性 为什么要加入这个属性呢: enctype就是encodetype就是编码类型的意思 ...

  7. Python学习笔记:List类型所有方法汇总

    ###############################红色标红的部分为常用方法############################### import copy names = [&quo ...

  8. ICPC训练联盟周赛Preliminaries for Benelux Algorithm Programming Contest 2019

    I题 求 a 数组平方的前缀和和求 a 数组后缀和,遍历一遍即可 AC代码 #include<iostream>#include<cmath>using namespace s ...

  9. Hadoop调试记录(1)

    错误 ERROR: Can't get master address from ZooKeeper; znode data == null 解决 关闭hadoop,发现stop-all.sh后几个进程 ...

  10. E 比赛评分

    时间限制 : - MS   空间限制 : - KB  评测说明 : 1s,128m 问题描述 Lj​最近参加一个选秀比赛,有N个评委参加了这次评分,N是奇数.评委编号为1到N.每位评委给Lj​的分数是 ...