单击时如何突出显示菜单链接 [英] how to highlight a menu link when clicked
问题描述
css：
< style type =text / css>
。 backround
{
保证金：0px 0;
填充：0;
position：absolute;
background-image：url（'Images / imageback.jpg'）;
font-family：Times New Roman;
font-size：small;
宽度：自动;
身高：自动;
字体大小：19px;
font-weight：粗体;
text-decoration：none;
}
.div
{
宽度：自动;
保证金：0px自动;
}
div ul li a：link，div ul li a：visited
{
display：block;
background-color：＃006699;
font-family：Arial，Helvet ica，sans-serif;
font-weight：bold;
font-size：14px;
color：＃c1bfd5;
text-align：center;
text-decoration：none;
padding：2px;
border-bottom：1px实心#fff;
宽度：150px;
行高：30px;
}
div ul a a：hover
{
background-color：＃030;
}
div ul li a：active，div ul li a.active
{
背景颜色：红色;
}
li ul li a：link，li ul li a：visited
{
disp lay：block;
background-color：＃99ccff;
font-family：Arial，Helvetica，sans-serif;
font-weight ：正常;
字体大小：12px;
颜色：蓝色;
text-align：center;
text-decoration：none;
填充：2px;
border-bottom：1px solid #fff;
宽度：150px;
行高：30px;
}
li ul li a：悬停
{
背景色：#CCFFFF;
}
li ul li a：active，li ul li a.active
{
background-color：Red;
}
ul
{
list-style-type：none;
保证金：0px;
填充：0px;
宽度：1092px;
}
div ul
{
float：left;
宽度：150px;
}
ul li ul li
{
float：none;
margin-left：0px;
}
li ul
{
display：none;
仓位：绝对;
}
li：悬停ul
{
显示：无;
}
.style1
{
身高：25px;
}
.highlight_stay
{
背景颜色：红色;
}
< / style>
- 导入
- 员工大师
- 薪水
- 月工资明细
- Import
- Employee Master
- Salary
- Monthly Salary Details
推荐答案
尝试 http：//www.dynamicdrive。 com / forums / showthread.php？48406-Highlight-current-page-in-navigation-menu [ ^ ]。
这篇关于单击时如何突出显示菜单链接的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
css :
<style type="text/css">
.backround
{
margin: 0px 0;
padding: 0;
position: absolute;
background-image: url( 'Images/imageback.jpg' );
font-family: Times New Roman;
font-size: small;
width: auto;
height: auto;
font-size: 19px;
font-weight: bold;
text-decoration: none;
}
.div
{
width: auto;
margin: 0px auto;
}
div ul li a:link, div ul li a:visited
{
display: block;
background-color: #006699;
font-family: Arial, Helvetica, sans-serif;
font-weight: bold;
font-size: 14px;
color: #c1bfd5;
text-align: center;
text-decoration: none;
padding: 2px;
border-bottom: 1px solid #fff;
width: 150px;
line-height: 30px;
}
div ul li a:hover
{
background-color: #030;
}
div ul li a:active,div ul li a.active
{
background-color:Red;
}
li ul li a:link, li ul li a:visited
{
display: block;
background-color: #99ccff;
font-family: Arial, Helvetica, sans-serif;
font-weight: normal;
font-size: 12px;
color: Blue;
text-align: center;
text-decoration: none;
padding: 2px;
border-bottom: 1px solid #fff;
width: 150px;
line-height: 30px;
}
li ul li a:hover
{
background-color: #CCFFFF;
}
li ul li a:active,li ul li a.active
{
background-color:Red;
}
ul
{
list-style-type: none;
margin: 0px;
padding: 0px;
width: 1092px;
}
div ul li
{
float: left;
width: 150px;
}
ul li ul li
{
float: none;
margin-left: 0px;
}
li ul
{
display: none;
position: absolute;
}
li:hover ul
{
display:none;
}
.style1
{
height: 25px;
}
.highlight_stay
{
background-color: Red;
}
</style>
