<!DOCTYPE html><html lang="zh-cn"><head> <meta charset="utf-8"> <title></title> <style> /* 注意将assistor和parent的大小设置为一样大*/ .assistor { position: relative; /*关键点*/ width: 400px; height: 250px; } .parent { width: 400px; height: 250px; overflow: auto; /*关键点*/ } table{ width: 410px; text-align: center; overflow:auto; } .child{ width: 385px; background: #CCCCCC; position: absolute; /*关键点*/ overflow: hidden; } .placeholder table{ margin-top: 23px; } </style></head><body><!-- 添加一层‘assistor‘ --><div class="assistor"> <div class="parent"> <div class="child"> <table> <thead> <tr> <th>姓名</th> <th>性别</th> <th>暂住地</th> </tr> </thead> </table> </div> <div class="placeholder"> <table> <tbody> <tr><td>张山1</td><td>男</td><td>浙江宁波</td></tr> <tr><td>张山2</td><td>男</td><td>浙江宁波</td></tr> <tr><td>张山3</td><td>男</td><td>浙江宁波</td></tr> <tr><td>张山4</td><td>男</td><td>浙江宁波</td></tr> <tr><td>张山5</td><td>男</td><td>浙江宁波</td></tr> <tr><td>张山6</td><td>男</td><td>浙江宁波</td></tr> <tr><td>张山1</td><td>男</td><td>浙江宁波</td></tr> <tr><td>张山2</td><td>男</td><td>浙江宁波</td></tr> <tr><td>张山3</td><td>男</td><td>浙江宁波</td></tr> <tr><td>张山4</td><td>男</td><td>浙江宁波</td></tr> <tr><td>张山5</td><td>男</td><td>浙江宁波</td></tr> <tr><td>张山6</td><td>男</td><td>浙江宁波</td></tr> </tbody> </table> </div> </div></div></body><script src="js/jquery-1.11.3.js"></script><script></script></html>
时间： 2024-10-14 07:42:29