用CSS控制onmouseover/out的背景颜色的方法

CSS与JS结合实现鼠标悬停效果

最新推荐文章于 2024-01-29 16:43:03 发布

最新推荐文章于 2024-01-29 16:43:03 发布 · 982 阅读

文章标签：

#CSS #IE #Firefox

WEB技术专栏收录该内容

127 篇文章

订阅专栏

本文介绍了一种利用CSS和JavaScript结合的方式实现网页元素的鼠标悬停交互效果的方法。通过简单的代码示例展示了如何改变元素背景颜色等属性，并保持页面样式的灵活性。

onmouseover: expression(onmouseover=function (){this.style.borderColor ='';
this.style.color='';this.style.backgroundColor ='#99E2FB'});

onmouseout: expression(onmouseout=function (){this.style.borderColor='';
this.style.color='';this.style.backgroundColor =''});

background-color:#00BFFF;

简单实用，这样在你更换样式的时候就不必再动程序页面，一个CSS搞掂

<style type="text/css">
.JsInCss{
event:expression(
onmouseover = function()
{
this.style.backgroundColor='#f0f0f0'
sotuku.style.display=''
},
onmouseout = function()
{
this.style.backgroundColor='#ffffff'
sotuku.style.display='none'
}
)
}
</style>