高手来,一个关于导航CSS的小问题。
发布网友
发布时间:2022-04-27 11:57
我来回答
共2个回答
热心网友
时间:2022-04-20 18:38
..你贴的代码里就有解决方案啊...大哥..
----------------------------------
.menu A.current {
FONT-WEIGHT: bold; FONT-SIZE: 14px; BACKGROUND-IMAGE: url(/images/menu_hover.jpg); COLOR: #87c806; TEXT-DECORATION: none
}
--------------------------
这个就是当前页面导航栏显示鼠标悬浮效果..但是我去你的网站上找不到这个css..
还有..就算你添上这个css样式,也不会显示的鼠标悬浮效果的..
接下来还有1步,有两种做法
第一种做法:
在后台程序里判断, 判断当前页面的地址是menu里的哪个a标签地址. 然后给这个标签加上 class="current"
第二种做法
在js里判断当前页面的地址..同上...
这就完了.
=============================================
还有一种解决方案,不用程序判断....只添加css即可.
就拿你的前三个连接来说
网站首页http://www.rz520.com/index.html 或者是 index.php
空间日志http://www.rz520.com//kongjianri/index.html 或者是 index.php
伤感日志http://www.rz520.com//shangganri/index.html 或者是 index.php
---------------
在首页的样式里添加
#index{
FONT-WEIGHT: bold; FONT-SIZE: 14px; BACKGROUND-IMAGE: url(/images/menu_hover.jpg); COLOR: #87c806; TEXT-DECORATION: none
}
在空间日志页面的样式里添加
#kongjianri{
FONT-WEIGHT: bold; FONT-SIZE: 14px; BACKGROUND-IMAGE: url(/images/menu_hover.jpg); COLOR: #87c806; TEXT-DECORATION: none
}
在伤感日志页面的样式里添加
#shangganri{
FONT-WEIGHT: bold; FONT-SIZE: 14px; BACKGROUND-IMAGE: url(/images/menu_hover.jpg); COLOR: #87c806; TEXT-DECORATION: none
}
然后在菜单的链接里添上样式.一般有一个common_header或者header的一个文件.
进去把前三个连接添上样式.
空间首页加上 id="index" <a href="/" id="index">空间首页</a>
空间日志加上 id="kongjianri" <a href="//kongjianri/" id="kongjianri">空间日志</a>
伤感日志加上 id="shangganri" <a href="//shangganri/" id="shangganri">伤感日志</a>
...就ok了..追问谢谢你,可惜我对这些都不太懂~
追答~_~...加我扣扣,,我远程*??
yzbczq@qq.com
热心网友
时间:2022-04-20 19:56
link:连接平常的状态
active:连接被按下的时候
visited:连接被访问过之后
hover:鼠标放到连接上的时候
.menu A:visited {
DISPLAY: block; FONT-SIZE: 14px; WIDTH: 99px; COLOR: #000; PADDING-TOP: 20px; BACKGROUND-IMAGE: url(/images/menu_hover.jpg); background-repeat: no-repeat; HEIGHT: 25px; TEXT-ALIGN: center; TEXT-DECORATION: none
}追问你好,我不是要这种效果,你这种效果是菜单一旦被访问之后都会显示成那样。我需要的是在当点击A菜单时会显示鼠标放到连接时的效果,当点击B菜单时,A菜单就回复到正常状态。