ホームページ > 記事 > ウェブフロントエンド > CSS を使用して table_html/css_WEB-ITnose にフローティング レイヤーを設定する方法
CSS を使用して table_html/css_WEB-ITnose にフローティング レイヤーを設定する方法
- WBOYオリジナル
- 2016-06-24 12:20:111266ブラウズ
写真に示すように、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> 声明：
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。