css怎么设置鼠标变背景热门三篇

大家对网页制作的CSS应该不陌生吧，那么，你们知道怎么设置鼠标变换背景的?下面是读文网小编带来的关于css设置鼠标变背景的内容，欢迎阅读!

方法1

使用CSS :hover 伪类可以达到这个效果。

定义和用法

:hover 选择器用于选择鼠标指针浮动在上面的元素。

提示：:hover 选择器可用于所有元素，不只是链接。

提示：:link 选择器设置指向未被访问页面的链接的样式，:visited 选择器用于设置指向已被访问的页面的链接，:active 选择器用于活动链接。

注释：在 CSS 定义中，:hover 必须位于 :link 和 :visited 之后(如果存在的话)，这样样式才能生效。

实例

div{background-color:grern;}div:hover{ background-color:yellow;}/*当鼠标悬浮到div上方是，将背景颜色更改为黄色*/

方法2

于是仔细研究了一下，发现了这么句话：

*::-moz-selection {colorfc5;background-color:#0f581a;}

恩，一看都知道了。

又在 google 中发现了一片

方法3

假设你的按钮的class是btn，两个背景图片分别是bg1.jpg和bg2.jpg，那么可以这样来做

css部分：

.btn {background:url(bg1.jpg);}

.btn:hover {background:url(bg2.jpg);}

html部分就很简单了，给input加个样式就行

使用这个样式时别忘了先把input的默认样式，那些padding、margin、border什么的都清零，然后再定义一下宽高，这样出来的视觉效果会好些。