Heim > Artikel > Web-Frontend > 为什么图片会覆盖文字的显示_html/css_WEB-ITnose
为什么图片会覆盖文字的显示_html/css_WEB-ITnose
- WBOYOriginal
- 2016-06-24 12:17:024631Durchsuche
图片一旦下滑以后图片就会被遮住了 如何让文字不被图片遮住
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"><script type="text/javascript" src="jquery.js"></script> <script type="text/javascript"> $(document).ready(function(){ $("a").mouseover(function(){var id= $(this).attr("id");var i=id.replace("A", "B");$("#"+i).animate({top:"0px"},400); }); $("a").mouseout(function(){var id= $(this).attr("id");var i=id.replace("A", "B");$("#"+i).animate({top:"-149px"},400); }); }); </script> <style type-"text/css">img { position:absolute; top:-149px; }li{margin: 0; padding: 0; border: 0;}ul {width: 700px; margin: 0 auto; text-align: center;} li {float:right;list-style: none;} li a{ display: block; width: 97px; padding: 72px 0 0 0; margin: 0 32px 0 32px; font: bold 16px Helvetica; }</style> <ul><li><a id="A1" >A</a><img id="B1"src="1.png" / alt="为什么图片会覆盖文字的显示_html/css_WEB-ITnose" ></li> <li><a id="A2" >B</a><img id="B2"src="1.png" / alt="为什么图片会覆盖文字的显示_html/css_WEB-ITnose" ></li><li><a id="A3" >C</a><img id="B3"src="1.png" / alt="为什么图片会覆盖文字的显示_html/css_WEB-ITnose" ></li> <li><a id="A4" >D</a><img id="B4"src="1.png" / alt="为什么图片会覆盖文字的显示_html/css_WEB-ITnose" ></li></ul> 回复讨论(解决方案)
position:absolute;
如果某个标签带有这个属性，那么该标签就不在归属于文档流，那么如果在该标签定义的位置也有其他标签，那么这个标签会覆盖其他没有带有position:absolute;这个属性的标签。
像这样的，需要特别注意，可以都加上position属性，或者就得自己控制，别被覆盖到了。
应该是这样的
高手帮我修改一下 这样说我修改不出
li a{ position:relative; top:20px; z-index:1000; display: block; width: 97px; padding: 72px 0 0 0; margin: 0 32px 0 32px; font: bold 16px Helvetica; } 修改上面那三个，或者你查一下上面三个的意思，按照自己要的，进行修改试试吧
Stellungnahme：
Der Inhalt dieses Artikels wird freiwillig von Internetnutzern beigesteuert und das Urheberrecht liegt beim ursprünglichen Autor. Diese Website übernimmt keine entsprechende rechtliche Verantwortung. Wenn Sie Inhalte finden, bei denen der Verdacht eines Plagiats oder einer Rechtsverletzung besteht, wenden Sie sich bitte an admin@php.cn
Vorheriger Artikel：一个固定宽度的DIV内，怎么会出现图片中的空格？？_html/css_WEB-ITnoseNächster Artikel：css中一个div可以同时设置左浮动和相对定位？_html/css_WEB-ITnose