如何用CSS 设置 当鼠标移动到菜单时,该按钮变色,鼠标点击后，页面停留在鼠标滑过时的状态！！很急！
Posted
tags:
篇首语：本文由小常识网(cha138.com)小编为大家整理，主要介绍了如何用CSS 设置 当鼠标移动到菜单时,该按钮变色,鼠标点击后，页面停留在鼠标滑过时的状态！！很急！相关的知识，希望对你有一定的参考价值。
参考技术A 是链接按钮吧，只需要更换下背景就行了abackground:#fff; 正常状态下
a:hover background:url("image/bg.jpg") #000; 鼠标在菜单上的颜色，没使用图片做背景就直接写颜色
点击后停留状态停留，点击后给该链接按钮加个class或id 如<a class='home'></a> 然后写下该类的css样式和鼠标停留在上面的一样就行了，如
a.home background:url("image/bg.jpg") #000;
至于怎么加个class类就根据你代码实际情况了本回答被提问者采纳 参考技术B 利用a的四个伪类就行了 下面是四个伪类的介绍：
A的四个伪类
:link 未被访问前的样式表属性
:visited 其链接地址已被访问过时的样式表属性
:active 用户激活（在鼠标点击与释放之间发生的事件）时的样式表属性
:hover 鼠标悬停时hover
写法：a:link/:visited/:hover/:active 或者a:link/:visited/:active/:hover 顺序不能互换，有一个比较好记的口诀，就是："love -- hate" 参考技术C 用javascript就可以，基本代码在下面，你自己照着改吧
<html>
<head>
<meta http-equiv="Content-Type" content="text/html;charset = gb2312" />
</head>
<body>
<script type="text/javascript">
function changeA()
document.getElementById("menuA").style.background='#f00';
document.getElementById("menuB").style.background='#fff';
function changeB()
document.getElementById("menuB").style.background='#f00';
document.getElementById("menuA").style.background='#fff';
</script>
<input type="button" onclick="changeA()" value="A"/>
<input type="button" onclick="changeB()" value="B"/>
<div id="menuA" style="width:300px;height:300px;">
A
</div>
<div id="menuB" style="width:300px;height:300px;">
B
</div>
</body>
</html>
当站点变窄（响应）时，更改菜单会浮动
我在www。结构数据。 com
当网站位于桌面上时，它看起来很棒。但是，当它开始变窄时，红色的“注册”按钮开始与菜单重叠，我想在CSS中进行媒体查询，当在较小的屏幕上查看时，该按钮将迫使按钮下降到导航下方。我该怎么办？
标题设置为
<div id="header_main">
<div class="container">
<div class="inner-container">
<strong class="logo"></strong>
<nav class="main_menu"></nav>
<div id="text-8" class="widget"> BUTTON IS HERE </div>
</div>
</div>
</div>
我尝试设置.header_main.widget
到display：block和inline-block，但都不起作用。我尝试清除了：两者都一样。
答案
媒体查询可能很棘手，您可以阅读很多有关here(w3c)和here(mdn)的信息>
在您的情况下，媒体查询将如下所示：
@media screen and (max-width:320px) { #header_main .container .inner-container .widget { /*Styles go here*/ } }希望这会有所帮助！
另一答案
您的导航栏和您的按钮位于不同的z-index上，这将非常棘手。这也是clear无效的原因。
以上是关于如何用CSS 设置 当鼠标移动到菜单时,该按钮变色,鼠标点击后，页面停留在鼠标滑过时的状态！！很急！的主要内容，如果未能解决你的问题，请参考以下文章
为啥css做的二级导航，当鼠标停留在一级上时候，二级菜单正常显示。当鼠标移动到二级菜单，