CSS 点击事件
:active 伪类向激活(在鼠标点击与释放之间发生的事件)的元素添加特殊的样式。
这个伪类应用于处于激活状态的元素。最常见的例子就是在 HTML 文档中点击一个超链接:在鼠标按钮按下期间,这个链接是激活的。还有其他一些方式来激活元素,另外从理论上讲其他元素也可以被激活,不过 CSS 对此没有定义。
说明
激活的、已访问的、未访问的或者当有鼠标悬停在其上的链接,它们会在支持 CSS 的浏览器中以不同的方式显示出来:
a:link {color: #FF0000} /* 未访问的链接 */
a:visited {color: #00FF00} /* 已访问的链接 */
a:hover {color: #FF00FF} /* 当有鼠标悬停在链接上 */
a:active {color: #0000FF} /* 被选择的链接 */
注释:为了产生预期的效果,在 CSS 定义中,a:hover 必须位于 a:link 和 a:visited 之后!!
注释:为了产生预期的效果,在 CSS 定义中,a:active 必须位于 a:hover 之后!!
注释:Pseudo-class(伪类)的名称对大小写不敏感。
注释:伪类可与 CSS 类配合使用:
CSS 点击事件的更多相关文章
- [CSS] 点击事件触发的动画
源码 https://github.com/YouXianMing/CSS-Animations/tree/master/Event 效果 细节 1) 一个完整的可回溯的动画至少包括了两种状态,以及两 ...
- CSS实现点击事件及实践
实现原理利用:target,把a标签自身的href以及id设置成一样的. 案例1:实现元素的切换 HTML: <div id="box"> <a href=&qu ...
- CSS鼠标响应事件经过、移动、点击示例介绍
本文为大家介绍下CSS 鼠标响应事件:鼠标经过CSS.鼠标移动CSS.鼠标点击CSS以及示例,喜欢的朋友可以参考下 几种鼠标触发CSS事件. 说明: onMouseDown 按下鼠标时触发 onM ...
- css禁用鼠标点击事件
css禁用鼠标点击事件 .disabled { pointer-events: none; } <div class="main-container disabled"> ...
- css处理事件透过、点击事件透过
// 执行一些动作... $("#myModal2").css("pointer-events","none"); // 执行一些动作... ...
- 纯CSS实现点击事件展现隐藏div菜单列表/元素切换
在写移动端导航的时候经常用到点击按钮出现/隐藏导航条的情况,最常见的方法当然还是前端框架直接调用,省心省力,不易出错:当然还有使用纯JS实现的小代码段.我这里整理了纯CSS实现方式,给需要的人和给自己 ...
- 项目遇到的小问题(关于vue-cli中js点击事件不起作用和iconfont图片下载页面css样式乱的解答)
第一个:关于vue-cli中js点击事件不起作用 在vue的methods方法queryBtnFun()中拼接html和click操作事件的时候,发现点击事件一起未起作用: 后来发现是DOM执行顺序 ...
- CSS伪类选择器active模拟JavaScript点击事件
一.说明 设置元素在被用户激活(在鼠标点击与释放之间发生的事件)时的样式. IE7及更早浏览器只支持a元素的:active,从IE8开始支持其它元素的:active. 另:如果需要给超链接定义:访问前 ...
- CSS 解决z-index上层元素遮挡下层元素点击事件问题
解决z-index上层元素遮挡下层元素点击事件问题 by:授客 QQ:1033553122 开发环境 Win 10 element-ui "2.8.2" Vue 2.9.6 需求 ...
随机推荐
- 安装spy-debugger查看前端日志
有时需要查看前端页面日志,但是前端同学有时忘记开启vConsole.为了调试方便,最好在本地可以查看前端日志,做到一劳永逸. 1.安装node 网上搜教程 2.安装spy-debugger sudo ...
- SSH框架总结(环境搭建+框架分析+实例源码下载)
一.SSH框架简介 SSH是struts+spring+hibernate集成的web应用程序开源框架. Struts:用来控制的,核心控制器是Controller. Spring:对Struts和H ...
- cordova 常用操作
#创建插件 plugman create --name MyMath --plugin_id SimpleMath --plugin_version #进入插件目录 cd MyMath #plugin ...
- MyBatis 工作原理
参考链接: 深入理解Mybatis原理:http://blog.csdn.net/luanlouis/article/details/40422941 MyBatis原理:http://www.jia ...
- Java虚拟机------JVM分析工具
主要介绍JVM的分析工具: jps jps:Java Virtual Machine Process Status Tool http://docs.oracle.com/javase/1.5.0/d ...
- 用ng-style修改元素的color, size等
1) 在Controller中定义变量myStyle var myStyle={'background-color':'blue'} $scope.myStyle = myStyle; 2) 在HTM ...
- Anatomy of a Program in Memory.剖析程序的内存布局
原文标题:Anatomy of a Program in Memory 原文地址:http://duartes.org/gustavo/blog/ [注:本人水平有限,只好挑一些国外高手的精彩文章翻译 ...
- 《Linux性能及调优指南》第二章:监控和基准工具2.1-2.2
翻译:飞哥 (http://hi.baidu.com/imlidapeng) 版权所有,尊重他人劳动成果,转载时请注明作者和原始出处及本声明. 原文名称:<Linux Performance a ...
- 使用Solrj 获取语句分词结果的代码
import java.util.ArrayList; import java.util.Iterator; import java.util.List; import org.apache.log4 ...
- [Lua]table(二):删除与排序
function PrintTable(tb) for k,v in pairs(tb) do print(v) end print("-------------------") ...