如何在一个td里实现css的叠层?

[jackker]

代码如下:
<table width="200" height="200" align="center"><!--绝对不能改变这一行内容-->
<tr><td bgcolor="#eeeeee" align="center" valign="middle">"><!--绝对不能改变这一行内容-->

<div style="background-color:red;width:180;height:180;">A</div>
<div style="background-color:blue;height:30;width:100;">B</div>

</td></tr>"><!--绝对不能改变这一行内容-->
</table>"><!--绝对不能改变这一行内容-->


我要达到的效果:
A处于td正中间
B处于td的右下角(叠层覆盖着A的一小部分)

在线等!可用立刻结贴~~多谢!

[hookee]

IE

<table width="200" height="200" align="center">
<tr> <td bgcolor="#eeeeee" align="center" valign="middle">

<div style="background-color:red;width:180;height:180;z-index:1;"> A </div>
<div style="background-color:blue;height:30;width:100;z-index:2;position:absolute;left:expression(this.parentNode.parentNode.parentNode.parentNode.offsetLeft+this.parentNode.offsetLeft+this.parentNode.clientWidth-this.clientWidth);top:expression(this.parentNode.parentNode.parentNode.parentNode.offsetTop+this.parentNode.offsetTop+this.parentNode.clientHeight-this.clientHeight);"> B </div> 

</td> </tr>
</table>

[jackker]

有没有符合w3c的标准写法?

[myvicy]

<table width="200" height="200" align="center"> <!--绝对不能改变这一行内容-->
<tr> <td bgcolor="#eeeeee" align="center" valign="middle"> <!--绝对不能改变这一行内容-->

<div style="background-color:red;width:180px;height:180px;z-index:1;"> A </div>
<div style="position:absolute;float:right;top:180px;background-color:blue;height:30px;width:100px;z-index:2;"> B </div>

</td> </tr> "> <!--绝对不能改变这一行内容-->
</table> "> <!--绝对不能改变这一行内容-->

[一把编程的菜刀]

如果你遮盖住内容，不让A遮盖的部分显示出来好做
如果还想他显示出来
FF下的滤镜直接用不了

[一把编程的菜刀]

如果只是遮住那部分不让显示，那就用1楼的

[meiZiNick]

有点难度哦

[knowledge_Is_Life]

好像没那么简单,呵呵.