Z-index属性CSS [英] Z-index attribute CSS
问题描述
我在用z-index的问题。
我想设置一个< A>
上时,悬停它改变了类<一>
并使它超过一些东西。
所以我已经设置了< A>
的的z-index = -1
和其他东西的的z-index = 1
,当你悬停它改变了< A>
的类,并在类的z-index = 2
所以假设是比其他的事情,但事实并非如此。我试图设置上悬停,而不是改变< A>
的的z-index
我已经改变了另一件事的z-index
到 -2
,但没有奏效。
我不想使用显示=无
,然后更改显示,因为当画面不是比其他的事情你仍然可以看到它的一些
这是什么问题?如何解决呢?
THX的帮助:D
编辑:这里是code:
背后code:
保护无效show_view1(对象发件人,EventArgs的发送)
{
L1.Attributes.Add(类,活动);
}
HTML
< DIV ID ='settingNev'>
< UL>
<李ID =L1=服务器><一个ID =A1onserverclick =show_view1=服务器><跨度>个人及LT; / SPAN>< / A>&LT ; /李>
< / UL>
< / DIV>
我想这TIO结束的当鼠标悬停是在&LT表;一>
:
<表样式=边界:1px的纯黑色;填充:0像素0像素0像素0像素;保证金:0像素0;位置:亲属; z-index的:1; CELLSPACING =20>
CSS:
#settingNev {
浮动:左;
宽度:100%;
背景:TRANSPERANT;
字体大小:93%;
行高:正常;
}
#settingNev UL {
保证金:0;
填充:10px的10px的0 50px的;
列表样式:无;
}
#settingNev李{
显示:内联;
保证金:0;
填充:0;
}
//....here是z-index的集................
#settingNev一个{
浮动:左;
保证金:0 0 3PX的3px;
填充:0 0 0 4像素;
文字修饰:无;
的z-index:-1;
边框:1px的纯黑色;
边界半径:6像素6像素0像素0像素;
// .............................................
}
#settingNev跨度{
浮动:左;
显示:块;
填充:为5px 15px的4PX 6个像素;
颜色:#666;
}
#settingNev跨度{
飘:无;
}
#settingNev。主动的跨度,
#settingNev:悬停跨度{
颜色:#FFFFFF;
}
#settingNev。主动一,
#cssmenu:悬停{
背景位置:0 -42px;
下边框:0像素纯黑色;
}
//....here是z-index的集................
#settingNev。主动的跨度,
#settingNev:悬停跨度{
背景位置:100%-42px;
的z-index:2;
}
若要的z-index
工作,你必须有这个位置
(S)为您的风格元素
- 绝对
- 相对
- 固定
任何其他位置
让的z-index
到不行。
I'm having a problem with the z-index.
I want to set a <a>
that on when is hover it changes the class of the <a>
and makes it be over something.
So I have set the <a>
's z-index=-1
and the other thing's z-index=1
and when you hover it changes the <a>
's class and in the class the z-index=2
so it suppose to be over the other thing, but it doesn't. I tried to set that on hover instead of changing the <a>
's z-index
I have changed the other thing z-index
to -2
and yet it didn't work.
I don't want to use the display=none
and then to change the display because when the picture is not over the other thing you can still see some of it.
What is the problem? How do I fix it?
Thx for the help :D
EDIT: here is the code:
Code behind:
protected void show_view1(object sender, EventArgs e)
{
L1.Attributes.Add("class", "active");
}
html:
<div id='settingNev' >
<ul >
<li id="L1" runat="server"><a id="A1" onserverclick="show_view1" runat="server"><span>Personal</span></a></li>
</ul>
</div>
the table i want it tio be over of when the mouse is hover the <a>
:
<table style="border:1px solid black; padding:0px 0px 0px 0px; margin: 0px 0; position:relative; z-index:1;" cellspacing="20">
css:
#settingNev {
float: left;
width: 100%;
background: TRANSPERANT;
font-size: 93%;
line-height: normal;
}
#settingNev ul {
margin: 0;
padding: 10px 10px 0 50px;
list-style: none;
}
#settingNev li {
display: inline;
margin: 0;
padding: 0;
}
//....here is the z-index set................
#settingNev a {
float: left;
margin:0 3px 0 3px;
padding: 0 0 0 4px;
text-decoration: none;
z-index:-1;
border:1px solid black;
border-radius: 6px 6px 0px 0px;
//.............................................
}
#settingNev a span {
float: left;
display: block;
padding: 5px 15px 4px 6px;
color: #666;
}
#settingNev a span {
float: none;
}
#settingNev .active a span,
#settingNev a:hover span {
color: #FFFFFF;
}
#settingNev .active a,
#cssmenu a:hover {
background-position: 0 -42px;
border-bottom:0px solid black;
}
//....here is the z-index set................
#settingNev .active a span,
#settingNev a:hover span {
background-position: 100% -42px;
z-index:2;
}
To make z-index
works you must have one of this position
(s) to you style element
- absolute
- relative
- fixed
any other position
make z-index
to not work.
这篇关于Z-index属性CSS的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!