首页 诗词 字典 板报 句子 名言 友答 励志 学校 网站地图
当前位置: 首页 > 教程频道 > 网站开发 > CSS >

怎样用CSS在table中设立浮动层

2013-06-25 
怎样用CSS在table中设置浮动层如图,怎么样在该空模板中用CSS设置浮动层。求教!!![解决办法]!DOCTYPE html

怎样用CSS在table中设置浮动层
怎样用CSS在table中设立浮动层如图,怎么样在该空模板中用CSS设置浮动层。求教!!!
[解决办法]


<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" >
<head>
    <title>Untitled Page</title>
    <style type="text/css">
        .tb1 td
        {
          border:solid 1px blue;
        }
         .tb1 input
        {
          width:50px
        }
        .tb2
        {
          /*通过ie6 ie7 ie8 ff3 opera 谷歌 safari测试*/
          background-color:#0000CC;filter:alpha(opacity=20); -moz-opacity:0.5; opacity:0.5;/*遮罩层一定要设置背景,否则起不到遮罩作用。opacity=0时,遮罩层完全透明*/
        }
    </style>
    <script type="text/javascript">
    function Showtb2()
    {
      document.getElementById("tb2").style.display="block";
    }
    function Hidetb2()
    {
      document.getElementById("tb2").style.display="none";
    }
    </script>
</head>
<body>
    <table cellpadding="0" cellspacing="0" style="height:200px; width:200px; margin-top:0px; position:absolute" class="tb1">
        <tr>
            <td>
               <input id="Text1" type="text" /></td>
            <td>
               <input id="Text2" type="text" /></td>
            <td>
               <input id="Text3" type="text" /></td>
        </tr>
        <tr>
            <td>
               <input id="Text4" type="text" /></td>


            <td>
               <input id="Text5" type="text" /></td>
            <td>
               <input id="Text6" type="text" /></td>
        </tr>
        <tr>
            <td>
               <input id="Text7" type="text" /></td>
            <td>
               <input id="Text8" type="text" /></td>
            <td>
               <input id="Text9" type="text" /></td>
        </tr>
    </table>
    <table id="tb2" cellpadding="0" cellspacing="0" style="height:200px; width:200px; margin-top:0px; position:absolute; display:none" class="tb2">
    <tr>
    <td></td>
    </tr>
    </table>
    
    <div style="margin-top:250px; position:absolute">
        <input id="Button1" type="button" value="显示"  onclick="Showtb2()"/>
        <input id="Button2" type="button" value="隐藏"  onclick="Hidetb2()"/>
    </div>
</body>

</html>

热点排行