拖动滚动条，保持表头固定的HTML写法

最新推荐文章于 2022-03-24 11:38:00 发布

jeff9099

最新推荐文章于 2022-03-24 11:38:00 发布

阅读量1.3k

点赞数

本文链接：https://blog.csdn.net/baidu_34217927/article/details/80521526

版权

<!DOCTYPE html>
<html>
<head>
<script src="https://code.jquery.com/jquery-1.11.3.js">
</script>
<style>
.bg{
	width:430px;
	overflow-x: scroll;
	position: relative;
}
#table2{
    display: block;
	background-color: #dedede;
	position: absolute;
	left:0;
	top:0;
}
#table2 thead{
	display:block;
}
#table1{
	height: 380px;
    overflow-y: scroll;
    display: block;
}
</style>
</head>

<body>
<div class="bg" style="">
	<table id="table2" border="1px">
		<thead>
			<tr>
				<th>序号</th>
				<th>sdfsdgsgsdg</th>
				<th>dfgccccccccccccccc</th>
				<th>tghrthrhrhh</th>
				<th>yyyyccccccccc</th>
			</tr>
		</thead>
	</table>
	
	<table id="table1" border="1px">
		<thead>
			<tr>
				<th>序号</th>

最低0.47元/天解锁文章

确定要放弃本次机会？

福利倒计时

: :

立减 ¥

普通VIP年卡可用

立即使用

jeff9099

关注关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
拖动滚动条，保持表头固定的HTML写法

&lt;!DOCTYPE html&gt;&lt;html&gt;&lt;head&gt;&lt;script src="https://code.jquery.com/jquery-1.11.3.js"&gt;&lt;/script&gt;&lt;style&gt;.bg{ width:430px; overflow-x: scroll; position: relativ
复制链接

扫一扫