css鼠标点击效果怎么样(CSS实现鼠标滑过鼠标点击代码写法)
类别:Web前端 浏览量:2889
时间:2022-01-21 00:05:33 css鼠标点击效果怎么样
CSS实现鼠标滑过鼠标点击代码写法鼠标滑过元素,使得元素的样式发生改变
我们定义一个按钮标签
<button class="px-button">BUTTON</button>
我们首先设置按钮的背景颜色为灰色:
.px-button{
background-color: grey;
}
我们要使得鼠标滑过按钮的时候,让其变为蓝色,我们只需要增加hover选择器:
.px-button:hover{
background-color: blue;
}
我们要使得鼠标点击按钮的时候,让其变为红色,我们只需要增加active选择器:
.px-button:active{
background-color: red;
}
以上所述是小编给大家介绍的CSS实现鼠标滑过鼠标点击代码写法,希望对大家有所帮助,如果大家有任何疑问请给我留言,小编会及时回复大家的。在此也非常感谢大家对开心学习网网站的支持!
热门推荐
- python3 代码解读(Python3列表内置方法大全及示例代码小结)
- centosftp服务器的配置(CentOS6.9中搭建FTP服务器的方法)
- unix进程空间的区段(Unix/Linux fork隐藏的开销)
- nginx keepalived配置(Nginx+Keepalived实现Web服务器高可用)
- pythonselenium自动化教程(python使用selenium实现批量文件下载)
- python处理时间序列常用方法汇总(python整小时 整天时间戳获取算法示例)
- python指定参数教程(详解Python传入参数的几种方法)
- python字典的key(Python使用dict.fromkeys快速生成一个字典示例)
- sql两列合并成一列格式(SQL 将一列拆分成多列的三种方法)
- mysql与oracle体系结构(详解MySQL实时同步到Oracle解决方案)