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实现鼠标滑过鼠标点击代码写法,希望对大家有所帮助,如果大家有任何疑问请给我留言,小编会及时回复大家的。在此也非常感谢大家对开心学习网网站的支持!
热门推荐
- php数据类型图解(php使用filter_var函数判断邮箱,url,ip格式示例)
- lua接口调用崩溃(LuManager新开网站403故障的解决方法)
- dede友情链接改为logo轮播教程(织梦dede调用四级栏目的实现方法)
- vuevlog制作软件(Vue实现Dialog封装)
- cssdisplay覆盖规律(css解决display:inline-block;产生的缝隙间隙的方法)
- docker-compose 开发代码(Docker Compose多容器部署的实现)
- angular教程第九讲(浅谈Angular的12个经典问题)
- SqlServer2016模糊匹配的三种方式及效率问题简析(SqlServer2016模糊匹配的三种方式及效率问题简析)
- 如何提高代码可读性
- python程序锁教程(在python里协程使用同步锁Lock的实例)