在线等:以下收缩代码为什么会失效?
<style type= "text/css "> #menu
{
BORDER-RIGHT: #ff0000 1px solid; PADDING-RIGHT: 0px; PADDING-LEFT: 0px; FONT-SIZE: 12px; BACKGROUND: #f0f0f0; PADDING-BOTTOM: 0px; MARGIN: 0px; OVERFLOW: hidden; BORDER-LEFT: #ff0000 1px solid; WIDTH: 100%; PADDING-TOP: 0px; LIST-STYLE-TYPE: none; HEIGHT: 240px
}
#menu LI A
{
DISPLAY: block; MARGIN: 0px; WIDTH: 100%; COLOR: #00b; TEXT-DECORATION: none
}
#menu LI A SPAN
{
DISPLAY: none; COLOR: #000; HEIGHT: 10px
}
#menu LI A.one SPAN
{
DISPLAY: block; MARGIN: 0px 10px
}
#menu LI A:hover
{
BACKGROUND: #f1f1f1
}
#menu LI A:hover SPAN
{
DISPLAY: block; MARGIN: 0px 10px; CURSOR: pointer
}
#menu .h2
{
BORDER-RIGHT: 0px; PADDING-RIGHT: 0px; BORDER-TOP: 0px; PADDING-LEFT: 0px; PADDING-BOTTOM: 0px; MARGIN: 0px 5px; BORDER-LEFT: 0px; COLOR: #808; PADDING-TOP: 0px; BORDER-BOTTOM: 0px; FONT-VARIANT: small-caps
}
#menu .h3
{
PADDING-RIGHT: 0px; PADDING-LEFT: 0px; PADDING-BOTTOM: 0px; MARGIN: 0px 5px; COLOR: #00b; PADDING-TOP: 0px
}
.curved
{
MARGIN: 0px auto; WIDTH: 100%
}
.curved .b1
{
DISPLAY: block; FONT-SIZE: 1px; BACKGROUND: #88c; OVERFLOW: hidden
}
.curved .b2
{
DISPLAY: block; FONT-SIZE: 1px; BACKGROUND: #88c; OVERFLOW: hidden
}
.curved .b3
{
DISPLAY: block; FONT-SIZE: 1px; BACKGROUND: #88c; OVERFLOW: hidden
}
.curved .b4
{
DISPLAY: block; FONT-SIZE: 1px; BACKGROUND: #88c; OVERFLOW: hidden
}
.curved .b1
{
HEIGHT: 1px
}
.curved .b2
{
HEIGHT: 1px
}
.curved .b3
{
HEIGHT: 1px
}
.curved .b2
{
BORDER-RIGHT: #cccccc 1px solid; BACKGROUND: #f0f0f0; BORDER-LEFT: #cccccc 1px solid
}
.curved .b3
{
BORDER-RIGHT: #cccccc 1px solid; BACKGROUND: #f0f0f0; BORDER-LEFT: #cccccc 1px solid
}
.curved .b4
{
BORDER-RIGHT: #cccccc 1px solid; BACKGROUND: #f0f0f0; BORDER-LEFT: #cccccc 1px solid
}
.curved .b1
{
BACKGROUND: #cccccc; MARGIN: 0px 4px
}
.curved .b2
{
BORDER-TOP-WIDTH: 0px; BORDER-LEFT-WIDTH: 2px; BORDER-BOTTOM-WIDTH: 0px; MARGIN: 0px 2px; BORDER-RIGHT-WIDTH: 2px
}
.curved .b3
{
MARGIN: 0px 1px
}
.curved .b4
{
MARGIN: 0px; HEIGHT: 2px
}
</style>
<%--收缩模块设计--%>
<div class= "curved "> <FONT face= "宋体 "> </FONT> <FONT face= "宋体 "> </FONT> <b class= "b1 c1 "> </b> <b class= "b2 c2 "> </b> <b class= "b3 c3 "> </b> <b class= "b4 c4 "> </b>
<ul id= "menu ">
<li>
<A href= "#nogo "> <b class= "b1 "> </b> <b class= "b2 "> </b> <b class= "b3 "> </b> <b class= "b4 "> </b>
<b class= "h2 "> 展示指标选择 </b> <br>
<span> <FONT face= "宋体 "> </FONT>
<asp:DropDownList id= "DropDownList1 " runat= "server "> </asp:DropDownList>
<SELECT>
<OPTION value= " " selected> sDXSA </OPTION>
<OPTION value= " "> SDCA </OPTION>
<OPTION value= " "> </OPTION>
</SELECT>
</span> </A> </li> </ul>
<b class= "b4 "> </b> <b class= "b3 "> </b> <b class= "b2 "> </b> <b class= "b1 "> </b>
</div>
这段代码的作用是产生一个可以自动收缩的模版,在鼠标移动到模版上时显示模版中的控件,鼠标移开就自动隐藏。但是奇怪的是,当模版中有Edit和Select类的控件时,当鼠标移开后,这些控件无法自动隐藏,仍然会显示出来,请问到底是什么地方出错了?问题难度较大,分不够可以继续加,谢谢。
[解决办法]
可能是你的样式放的位置不正导致的
建议在顺序上查找
[解决办法]
帮你顶下,太长了,浓缩点
[解决办法]
CSS没问题,其他不知道了
[解决办法]
像这样的问题,还是自己好好看看吧,这样贴出来,太长了~
[解决办法]
用js实现了一下,楼主可以用htm页面试试.
<HTML>
<HEAD>
<style type=text/css>
.a
{
visibility: hidden;
}
.b
{
visibility: visible;
}
</style>
<script type=text/javascript language=javascript>
function show()
{
document.getElementById( 'text1 ').className= 'b ';
document.getElementById( 'select1 ').className= 'b ';
}
function hidden()
{
document.getElementById( 'text1 ').className= 'a ';
document.getElementById( 'select1 ').className= 'a ';
}
</script>
</HEAD>
<body onload= 'hidden() '>
<form id= "Form1 " method= "post " runat= "server ">
<div onmouseover= "show() " onmouseout= "hidden() " style= "WIDTH: 400px; POSITION: static; HEIGHT: 100px; BACKGROUND-COLOR: #cc9999 ">
<div id=text1 WIDTH:70px; HEIGHT:15px "> AAAAAAAAA </div>
<SELECT ID= "select1 " NAME= "Select1 ">
<OPTION value= " " selected> sDXSA </OPTION>
<OPTION value= " "> SDCA </OPTION>
<OPTION value= " "> </OPTION>
</SELECT>
</div>
</form>
</body>
</HTML>
[解决办法]
关注,帮顶下.楼下解决
[解决办法]
看晕了
帮顶下~!
[解决办法]
试了下,没有 SELECT 的也不行