用z-add img indexx:-99999怎么不能把img隐藏,有写position:absolute;了

请教高手,本人菜鸟,帮忙看看按钮怎么没了 &style& #marks{ position: z-index:1000; right:0; b_百度知道
请教高手,本人菜鸟,帮忙看看按钮怎么没了 &style& #marks{ position: z-index:1000; right:0; b
我有更好的答案
谁在上面的问题
&#47&/ #marks
{ position:1000,帮你看看,而定义了right:0
则是靠右边
z-&#47。你发下你的全部代码;这个是定义在Z轴上的值,如果还不能解决;
}-------应该就这些,主要是调整假如两个控件重叠了;绝对定位,关于你的按钮的问题;&#47:0;style&gt:absolute
其他类似问题
为您推荐:
等待您来回答
下载知道APP
随时随地咨询
出门在外也不愁当前位置:
div层调整z-index属性无效原因分析及解决方法
div层调整z-index属性无效原因分析及解决方法
div层调整zindex属性在IE中无效原因分析及解决方法
很久没有写前端代码了,最近有个项目需要亲自动手,但是在做的过程中,发现了一个很简单却又很多人应该碰到的问题,设置Z-INDEX属性无效。在CSS中,只能通过代码改变层级,这个属性就是z-index,要让z-index起作用有个小小前提,就是元素的position属性要是relative,absolute或是fixed。
1.第一种情况(z-index无论设置多高都不起作用情况):
这种情况发生的条件有三个:
1、父标签 position属性为relative;
2、问题标签无position属性(不包括static);
3、问题标签含有浮动(float)属性。
eg:z-index层级不起作用,浮动会让z-index失效,代码如下:
&div style="position: z-index:9999;"&
&img style="float:" src="1.z0./wp-content/uploads/084691.jpg" alt="div层调整z-index属性无效原因分析及解决方法"&
解决办法有三个(任一即可):
1、position:relative改为position:absolute;
2、浮动元素添加position属性(如relative,absolute等);
3、去除浮动。
2.第二种情况
IE6下,层级的表现有时候不是看子标签的z-index多高,而要看整个DOM tree(节点树)的第一个relative属性的父标签的层级。
eg:IE7与IE6有着同样的bug,原因很简单,虽然图片所在div当前的老爸层级很高(1000),但是由于老爸的老爸不顶用,可怜了9999如此强势的孩子没有出头之日啊!,代码如下:
&div style="position:"&
&div style="position: z-index:1000;"&
&div style="position: z-index:9999;"&
&img src="1.z0./wp-content/uploads/084691.jpg" alt="div层调整z-index属性无效原因分析及解决方法"&
解决办法: 在第一个relative属性加上一个更高的层级(z-index:1),代码如下:
&div style="position: z-index:1;"&
&div style="position: z-index:1000;"&
&div style="position: z-index:9999;"&
&img src="1.z0./wp-content/uploads/084691.jpg" alt="div层调整z-index属性无效原因分析及解决方法"&
作者:遺莣缘
转载请注明:
因为有梦所以执着,因为执着所以信赖,在这里停留总有一个理由…
您可能还会对这些文章感兴趣!妙用z-index让一个div显示在最前面
作者:佚名
字体:[ ] 来源:互联网 时间:09-11 17:06:10
css 的position定位在有重叠的时候,z-index越大就显示在最上面,现在大家应该知道了吧,感兴趣各位可以参考下
position定位如果有重叠的时候,z-index愈大,就显示在最上面此时我们就可以设置div的css样式z-index:99999,那么该div就显示在最前面
大家感兴趣的内容
12345678910
最近更新的内容当前位置:&&
position:relative/absolute无法冲破的等级
&&&&来源:&互联网& 发布时间:
&&&&position&:&osition 属性规定元素的定位类型。这个属性定义建立元素布局所用的定位机制。任何元素都可以定位,不过绝对或固定元素会生成一个块级框,而不论该元素本身是什么类型。相对定位元素会相对于它在正常流中的默认位置偏移。&&&&z-index&:&z-index是针对网页显示中的一个特殊属性。因为显示器是显示的图案是一个二维平面,拥有x轴和y轴来表示位置属性。为了表示三维立体的概念如显示元素的上下层的叠加顺序引入了z-index属性来表示z轴的区别。表示一个元素在叠加顺序上的上下立体关系。&&&&代码&:&代码就是程序员用开发工具所支持的语言写出来的源文件,是一组由字符、符号或信号码元以离散形式表示信息的明确的规则体系。代码设计的原则包括惟一确定性、标准化和通用性、可扩充性与稳定性、便于识别与记忆、力求短小与格式统一以及容易修改等。
源代码是代码的分支,某种意义上来说。
注:本文实例在IE5.x下可能会显示不出来,请使用IE6、IE7、Firefox、Opera等浏览器来调试! 前段时间记得好像是谁在群里提出了一个实在是让大家都觉得很不理解的一个问题:
代码如下:&ul&
&li&第一块&/li&
&li&&span&第二块&/span&&/li&
&li&第三块&/li&
&li&第四块&/li&
&li&第五块&/li&
如果我我们设定LI为position:设置span为position:那么我们会发现无论SPAN的z-index值设置得再高都将永远在后面父级的下面。
代码如下:*{margin:0; padding:0; list-style:}
li {width:100 height:100 margin:0 5px 0 0; background:#000; float: position: z-index:1;}
li span {width:200 height:200 background:#c00; position: top:0; left:100 z-index:1000;}
[Ctrl+A 全选 注:如需引入外部Js需刷新才能执行]
提示:您可以先修改部分代码再运行 试一下很容易发现我们的子级,z-index的值达到了1000的被设定了position:子级都被档在了父级的下面。我想了很久,我觉得其根本问题是:设置同样的position:relative/同级标签之间的等级是无法用z-index超越的。我们上面的例子中的第一个LI的等级永远都要小于后一个LI的等级,所以我们在LI里的子级身上设置了position:,给了非常高的z-index值。 也许你会这样来想:只要针对有span的LI设置position:不就好了吗?非常正确。当其它的LI都不设置position:那么我们需要的那个子级就可以浮在所有的内容之上。但是如果实际上,所有的LI中都要有span,并且属性都需要一样怎么办?当然我们不大会需要有这样的效果。但是我们需要有这样的效果:子级全部是隐藏的,当有鼠标反应时出现并且浮在所有的内容之上。我们要知道,这确实是件让人头疼的事,因为我们上面见识到了,子级在显示的时候都被压在了下一个父级标签的下面。下面我们来实现一下这个鼠标反应的定位效果:
代码如下:&ul&
&li&&a href="" title=""&&span&第一块&/span&&/a&&/li&
&li&&a href="" title=""&&span&第二块&/span&&/a&&/li&
&li&&a href="" title=""&&span&第三块&/span&&/a&&/li&
&li&&a href="" title=""&&span&第四块&/span&&/a&&/li&
&li&&a href="" title=""&&span&第五块&/span&&/a&&/li&
我们通过链接的鼠标事件来完成这个显示隐藏效果:
代码如下:*{margin:0; padding:0; list-style:}
li {height:100 margin:0 5px 0 0; float: width:100}
li a {position: z-index:1; display: height:100 width:100
background:#000;}
li a:hover {background:#000000;}
li span {display:}
li a:hover span {display: background:#c00; width:200 height:200 position: top:0; left:100 z-index:1000; }
[Ctrl+A 全选 注:如需引入外部Js需刷新才能执行]
提示:您可以先修改部分代码再运行 我们设定了a为position:这样他的子级就会根据父级的左上角为坐标原点进行定位了。然后我们设定span的具体形状以及定位属性,然后把他隐藏了。我们再通过A的伪类:hover使得span被激活。我们看一下结果,我们会发现,所有应该在上面的现在全在下面了。那我们怎么解决这个难题呢,其实以CSS想强行突破是不太可能,所以我们反过来想,能不能让这个没有被触发的父级标签没有position:属性,而只是触发的时候才有级这个父级赋上这样的值?其实想到这里基本上已经可以解决所有的问题了:
代码如下:*{margin:0; padding:0; list-style:}
li {height:100 margin:0 5px 0 0; float: width:100}
li a {display: height:100 width:100
background:#000;}
li a:hover {position: z-index:1; }
li span {display:}
li a:hover span {display: width:200 height:200 background:#c00; position: top:0; left:100 z-index:1000; }
[Ctrl+A 全选 注:如需引入外部Js需刷新才能执行]
提示:您可以先修改部分代码再运行 我们只要针对a:hover来设定其属性为position:就可以了,这样只有在鼠标触发的时候A才会被赋于一个相对定位的属性。这样就完成可以解决被其它父级标签所挡的尴尬了。 当然如果不介意IE6或是IE5.X这样的浏览器我们还可以把代码再做简化:
代码如下:&ul&
&li&&span&第一块&/span&&/li&
&li&&span&第二块&/span&&/li&
&li&&span&第三块&/span&&/li&
&li&&span&第四块&/span&&/li&
&li&&span&第五块&/span&&/li&
CSS可以改成这样:
代码如下:*{margin:0; padding:0; list-style:}
li {height:100 margin:0 5px 0 0; float: width:100 background:#000;}
li:hover {position: z-index:1;}
li span {display:}
li:hover span {display: width:200 height:200 background:#c00; position: top:0; left:100 z-index:1000; }
*{margin:0; padding:0; list-style:}
li {width:100 height:100 margin:0 5px 0 0; background:#000; float:}
li:hover { position: z-index:1;}
li span {display: }
li:hover span { display: width:200 height:200 background:#c00; position: top:0; left:100 z-index:1000; }
[Ctrl+A 全选 注:如需引入外部Js需刷新才能执行]
提示:您可以先修改部分代码再运行 原始阅读: /andy/post/67.html
相关技术文章: &&&&
· ul 标签在 Mozilla 中默认是有 padding 值的,而在 IE 中只有 margin 有值。
· 同一个的 class 选择符可以在一个文档中重复出现,而 id 选择符却只能出现一次;对一个标签同时使用 class和 id 进行 CSS 定义,如果定义有重复,id 选择符做的定义有效。
· 初学可能会碰到这样一个情况,同样一个标签的属性在 IE 设置成 A 显示是正常的,而在 Mozilla 里必须要设成 B 才能正常显示,或者两个倒过来。 临时解决方法:选择符 {属性名:B ! 属性名:A;} //IE7 下无效
· 如果一组要嵌套的标签之间需要些间距的话,那就...... &&&&
*特殊符号:·⊙①⊕◎Θ⊙*○¤㊣㈱@の*□*☆** ▲△▼▽⊿
▂ ▃ ▄ ▆ * * ▉ ▊▋▌▍▎▏* 回 □ **≡ ↑↓→←↘↙♀♂┇┅‖$ @ * & # ※ 卍 卐 ∞Ψ §∮ № ⌒ * *标点符号: .。,、;:?!ˉˇ¨`~ 々~‖∶"'`|·… — ~ - 〃
‘'“”〝〞〔〕〈〉《》「」『』〖〗【】()[]{}︻︼﹄﹃
*数学符号: +-×÷﹢﹣±/= ∥∠ ≌ ∽ ≦ ≧ ≒﹤﹥ ≈ ≡ ≠ = ≤ ≥ < > ≮ ≯ ∷ ∶ ∫ ∮ ∝ ∞ ∧ ∨ ∑ ∏ ∪ ∩ ∈ ∵ ∴ ⊥ ∥ ∠ ⌒ ⊙ √∟⊿ ㏒ ㏑ % ‰ *单...... &&&&
css教程之lightboxcss教程之html、body标签的定义 第一部分视频 第二部分视频内容:一、100%的自适应高度要同时设置html和body标签。二、html标签的作用范围等于body标签作用范围加上滚动条。发布时间:css教程之hr标签的定义 视频地址css教程之table标签的定义......&nbsp最新技术文章: &&&&
强制不换行,直接使用white-space:nowrap即可。CSS设置不转行: overflow:hidden 隐藏 white-space:normal 默认 pre 换行和其他空白字符都将受到保护 nowrap 强制在同一行内显示所有文本,直到文本结束或者遭遇 br 对象例:强制不换行 代码如下: div{white-space:}
...... &&&&
某个元素设置无边框,只需要给元素设置border:none即可,当然设置border:0效果一样,但实际上两者是有性能差别的 代码如下:border:none:边框设置为为none,不做任何处理;border:0:边框宽度设置为0像素,但是实际上border-color和border-style还是在渲染的。然而在IE中,对于button和input元素确并不是这样,在IE6,7中border:none仅等价于border-style:none,而边框所占的空间还是在的。这导致了调input的宽度和高度在各个浏览器中不统一!在IE6,7中,虽然设置了border:none后,边框仍存在。不信你试一试。下面给...... &&&&
一、border:noneborder-style的简写在chrome审查元素看到以下结果 代码如下:element.style {border:border-top-style:border-right-style:border-bottom-style:border-left-style:border-width:border-color:}在firefox中用firebug查看元素会看到以下结果: 代码如下:element.style {
border:}注意这个medium值二、border:0border-width的简写在chrome审查元素看到以下结果......&nbsp
特别声明:169IT网站部分信息来自互联网,如果侵犯您的权利,请及时告知,本站将立即删除!
(C)2012-,站长邮箱:www_169it_(请将#改为@)div+css求助大神~_百度知道
div+css求助大神~
jpg" />小弟先在这里谢谢了.baidu大神帮帮忙~~~帮我写段CSS代码出来以下图片作为参考.com/zhidao/wh%3D600%2C800/sign=139dfe691c/a20a4fe8.jpg" esrc="http://a.com/zhidao/pic//zhidao/wh%3D450%2C600/sign=916e31d47aec54e741bb766/a20a4fe8,如果能帮我写出来我一定加分。两个文字标题的背景颜色分别是 蓝色358d90 红色d31b3a弹窗是图片哦~
&/title&;=&&quot.+&div&}else{eval(&&subdiv&&你把文字改成图片试下&;){eval(&showdiv(sid){whichEl&if&onclick=&&showdiv(1)&;&(whichEl;subdiv1&body&&eval(&/body&Script&sid&&none&function&示例head&sid);1.display&\&subdiv&&/&gt
&!DOCTYPE&html&PUBLIC&&-//W3C//DTD&XHTML&1.0&Transitional//EN&&&&html&xmlns=&&head&&meta&http-equiv=&Content-Type&&content=&text/&charset=utf-8&&/&&title&无标题文档&/title&&style&body{&margin:0;&padding:0;&background:#999;}.all{&margin:200px&0&0&400&width:400&height:101&position:&z-index:99999;}.red{&position:&top:0;&left:0&width:200&height:100&z-index:999;&background:#d31b3a;}.blue{&position:&top:0;&left:200&width:200&height:100&z-index:999;&background:#358d90;}.red&img{&display:}.blue&img{&display:}.red:hover&img{&display:&position:&top:-202&left:0;&width:400&height:200&z-index:-1;}.blue:hover&img{&display:&position:&top:-202&left:-200&width:400&height:200&z-index:-1;}&/style&&/head&&body&&div&class=&all&&&&&&&div&class=&red&&&img&src=&07444.jpg&&/&&/div&&&&&&div&class=&blue&&&img&src=&29250.jpg&&/&&/div&&/div&&/body&&/html&纯css的代码差不多思想是一样的 就看你怎么能够更好的嵌入到自己的代码里了 改一下图片路径
做好了纯css看看吧不懂追问
进来看看追问 谢谢了
晕你是店铺装修啊早说啊店铺装修有专门的组件 你找找 直接用就行了
哪写得了吗 ?
css无法做到弹出alert 只有通过js 或者jq
其他类似问题
为您推荐:
div的相关知识
等待您来回答
下载知道APP
随时随地咨询
出门在外也不愁}

我要回帖

更多关于 1z.p99999p.com 的文章

更多推荐

版权声明:文章内容来源于网络,版权归原作者所有,如有侵权请点击这里与我们联系,我们将及时删除。

点击添加站长微信