常见问题

据说是Google首页的网页模块拖动代码

作者:用户投稿2026-01-11 10:54:31

<!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>据说是Google首页的网页模块拖动代码</title> <style type="text/css"> .spanDiv{ position:relative; width:5px; height:5px; } .dragDiv,.nodragDiv{ position:relative; filter:alpha(opacity=100); opacity:1; margin-bottom:6px; background-color:#FFFFFF; } </style> </head> <body > <table id="dragTable" cellpadding="3" style=" border:solid 0px green;width:98%;"> <tr> <td valign="top" style="width:30%"> <table cellpadding="0" cellspacing="0" border="1" style="width:100%;border-collapse:collapse; border-color:Blue"> <tr id="titleBar1" style="height:22px; text-align:left; background-color:#547BC9;color:White; padding:3px;cursor:move;"> <th align="left" unselectable="on" >Title1</th> </tr> <tr style="height:130px;padding:3px;" align="left" valign="top" > <td unselectable="on">这里的字比较长....我来了....中国....中国...外国.，看一下有没有溢出></td> </tr> </table> <table cellpadding="0" cellspacing="0" border="1" style="width:100%;border-collapse:collapse; border-color:Blue"> <tr id="titleBar2" style="height:22px; text-align:left; background-color:#547BC9;color:White; padding:3px;cursor:move;"> <th align="left" unselectable="on" >Title2</th> </tr> <tr style="height:130px;padding:3px;" align="left" valign="top" > <td unselectable="on">Content2...</td> </tr> </table> </td> <td valign="top" style="width:50%"> <table cellpadding="0" cellspacing="0" border="1" style="width:100%;border-collapse:collapse; border-color:Blue"> <tr id="titleBar3" style="height:22px; text-align:left; background-color:#547BC9;color:White; padding:3px;cursor:move;"> <th align="left" unselectable="on" >Title3</th> </tr> <tr style="height:230px;padding:3px;" align="left" valign="top" > <td unselectable="on">Content3...</td> </tr> </table> </td> <td valign="top" style="width:20%"> <table cellpadding="0" cellspacing="0" border="1" style="width:100%;border-collapse:collapse; border-color:Blue"> <tr id="titleBar4" style="height:22px; text-align:left; background-color:#547BC9;color:White; padding:3px;cursor:move;"> <th align="left" unselectable="on" >Title4</th> </tr> <tr style="height:130px;padding:3px;" align="left" valign="top" > <td unselectable="on">Content4...</td> </tr> </table> <table cellpadding="0" cellspacing="0" border="1" style="width:100%;border-collapse:collapse; border-color:Blue"> <tr id="titleBar5" style="height:22px; text-align:left; background-color:#547BC9;color:White; padding:3px;cursor:move;"> <th align="left" unselectable="on" >Title5</th> </tr> <tr style="height:130px;padding:3px;" align="left" valign="top" > <td unselectable="on">Content5...</td> </tr> </table> </td> </tr> </table> </body> </html>
[Ctrl+A 全选注:引入外部Js需再刷新一下页面才能执行]

上一篇丨

纯CSS实现*牌效果

下一篇丨

代码经过精简后的仿QQ折叠菜单代码

全国咨询热线： 400-8878-609

新闻资讯

常见问题

据说是Google首页的网页模块拖动代码

联系我们