Heim > Web-Frontend > HTML-Tutorial > 怎样用CSS在table中设置浮动层_html/css_WEB-ITnose

怎样用CSS在table中设置浮动层_html/css_WEB-ITnose

WBOY
Freigeben: 2016-06-24 12:20:11
Original
1289 Leute haben es durchsucht

如图,怎么样在该空模板中用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>
Nach dem Login kopieren

Quelle:php.cn
Erklärung dieser Website
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
Beliebte Tutorials
Mehr>
Neueste Downloads
Mehr>
Web-Effekte
Quellcode der Website
Website-Materialien
Frontend-Vorlage