为何图片会覆盖文字的显示
日期：2014-05-17 浏览次数：20845 次
为什么图片会覆盖文字的显示
图片一旦下滑以后图片就会被遮住了 如何让文字不被图片遮住
------解决方案--------------------
修改上面那三个，或者你查一下上面三个的意思，按照自己要的，进行修改试试吧
图片一旦下滑以后图片就会被遮住了 如何让文字不被图片遮住
<!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" /></li>
<li><a id="A2" >B</a><img id="B2"src="1.png" /></li>
<li><a id="A3" >C</a><img id="B3"src="1.png" /></li>
<li><a id="A4" >D</a><img id="B4"src="1.png" /></li>
</ul>
------解决方案--------------------
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;
}修改上面那三个，或者你查一下上面三个的意思，按照自己要的，进行修改试试吧
免责声明： 本文仅代表作者个人观点，与爱易网无关。其原创性以及文中陈述文字和内容未经本站证实，对本文以及其中全部或者部分内容、文字的真实性、完整性、及时性本站不作任何保证或承诺，请读者仅作参考，并请自行核实相关内容。
