以下仅供参考！不对的评论下指正！
table貌似无论怎么设置td 高度table都会根据数据的变化而变化（宽度table-layout:fixed样式可以做到固定）高度而且当数据少的时候高度会平分table高度导致页面不好看whenload方法是用来解决当数据少的时候设置table高度使得界面不会难看！
现在table头不动的解决方式是使用2个table 一个用来显示我们需要看到的表头table1 一个用来显示表体table2，他们用用同样的宽度 表体装载在一个稍大于表体宽度的div2下（宽度自己看着设置） 表头table1和div1装载在相同的父标签div下
为了使得table1和table2显示宽度上能平齐用空白占位符占用了table2对应th区域。对应的th用占用相等空间的占位符占用。
以下有空格占位符的案例（都是百度的）
  == 普通的英文半角空格
  == ==   == no-break space （普通的英文半角空格但不换行）
　 == 中文全角空格 （一个中文宽度）
  ==   == en空格 （半个中文宽度）
  ==   == em空格 （一个中文宽度）
  == 四分之一em空格 （四分之一中文宽度）
相比平时的空格（ ），nbsp拥有不间断（non-breaking）特性。即连续的nbsp会在同一行内显示。即使有100个连续的nbsp，浏览器也不会把它们拆成两行。
<!doctype html>
<html>
<head>
<meta charset="UTF-8">
<style type="text/css">
.rendDivices,.CheckHis {
border: 1px solid #C1C1C1;
}
th {
height: 10px;
}
td {
word-wrap:break-word;
width: 11%;
text-align: left;
height: 10px;
}
tr{
max-height:10px;
}
</style>
<script type="text/javascript">
function whenLoad(){
var table = document.getElementById("checkShowTable");
var cel=table.children[0].children;
if(cel.length<20){
table.style.height=cel.length*20+"px";
var sss=0;
}
}
</script>
<title>test</title>
</head>
<body onload="whenLoad()">
<div >
<div style="margin: auto; boder: 3px solid red; width: 800px;height:600px;">
<table id="checkShowTableHead" class="rendDivices"
style="margin-top: 10px;width:100%;table-layout:fixed">
<tr>
<th class="rendDivices thnc">请问</th>
<th class="rendDivices thnc">去问人体有</th>
<th class="rendDivices thnc">去问人体</th>
<th class="rendDivices thnc">阿斯蒂芬</th>
<th class="rendDivices thnc">自行车v不</th>
<th class="rendDivices thnc">人推哦地方</th>
<th class="rendDivices thnc">阿斯蒂芬</th>
</tr>
</table>
<div style="width:815px;height: 100%;overflow:auto;margin-top:0;"}>
<table id="checkShowTable" class="rendDivices"
style="width:800px;height: 100%;margin-top:0;margin-top: 0;table-layout:fixed">
<tr>
<th class="rendDivices thncr">　　</th>
<th class="rendDivices thncr">　　　　　　</th>
<th class="rendDivices thncr">　　　　</th>
<th class="rendDivices thncr">　　　　</th>
<th class="rendDivices thncr">　　　　　</th>
<th class="rendDivices thncr">　　　　　　</th>
<th class="rendDivices thncr">　　　　</th>
</tr>
<tr>
<td class="rendDivices thncr">1111111111111111</td>
<td class="rendDivices thncr">2222222222</td>
<td class="rendDivices thncr">33333333333333333333333333333333</td>
<td class="rendDivices thncr">555555555555555555555555555555555555</td>
<td class="rendDivices thncr">44444444444444444444444444444444444444444444444444444444444</td>
<td class="rendDivices thncr">66666666666666666666666666666666666666666666666</td>
<td class="rendDivices thncr">77777777777777777777777777777777777777</td>
</tr>
</table>
</div>
</div>
</div>
</body>
</html>
相关推荐
首先，我们需要为表头定义一个CSS类，比如这里的.table-head，然后为其设置固定的高度和背景颜色，确保它在视觉上与表格主体（.table-body）有所区分。重要的是，给这个表头添加一个合适的padding-right样式。这个...
在网页开发中，数据展示通常会使用表格（Table）元素，而为了使用户能更方便地浏览和理解数据，我们常常需要实现表头点击时自动排序的功能。这个功能的实现主要依赖于JavaScript，因为它提供了对DOM操作和事件监听的...
一个table表头固定，内容可滚动的实用例子,同时可以实现增加，删除功能
在IT行业中，尤其是在网页开发和数据展示领域，"table表头及表头列锁定"是一项重要的技术需求。它主要用于创建动态、长数据量的表格，使得用户在滚动查看大量数据时，表头始终保持可见，方便用户理解每一列数据的...
在网页设计中，"table的表头固定"是一种常见的需求，尤其在展示大量数据时，保持表头在页面滚动时始终可见，可以帮助用户更好地理解数据列的含义。在这个场景下，我们通常会使用HTML的`<table>`元素来构建表格，并...
CSS控制table表头
Bootstrap Table多层表头实现实例代码 Bootstrap Table是一个功能强大的表格组件，它提供了许多有用的功能，包括多层表头的实现。在本文中，我们将分享基于Bootstrap Table组件实现多层表头的实例代码。 多层表头...
"实现Table表头和列固定"的目标就是解决这一问题，保持表头在滚动时始终显示，同时支持多表头和多列固定，确保布局清晰，无错位。 首先，我们需要理解HTML中的`<table>`元素是用于创建表格的基本结构。它由`<thead>...
本文将深入探讨如何使用`table`元素，并结合jQuery实现表头及列的固定，以便在滚动时保持关键信息可见，提高用户体验。 首先，让我们了解`table`的基本结构。一个`table`由`<table>`标签开启，`</table>`标签关闭。...
综上所述，实现“点击table表头字段带箭头标示”的功能涉及到了JavaScript事件处理、DOM操作、数组排序以及UI交互设计。这不仅是提高用户体验的重要手段，也是前端开发者必备的技能之一。通过不断实践和学习，我们...
在Element UI框架中，我们经常会遇到需要自定义表格（table）样式的需求，特别是改变表头（thead）的背景颜色。Element UI提供了一种灵活的方式来实现这个功能，通过使用`header-cell-style`属性。下面我们将详细...
"基于jQuery的table表头固定"通常涉及到以下关键技术点： 1. **分离表头和主体**：首先，我们需要将HTML表格的thead部分与tbody部分分离，这样在进行滚动操作时，thead可以独立于tbody进行定位。 2. **CSS定位**：...
这就是“layui table表头自带问号图标显示字段提示”功能。 要实现这个功能，我们首先需要在HTML中设置表格的基本结构，并通过layui的table模块进行渲染。在表格列定义（cols）中，我们可以在每个字段的配置对象里...
js table 表头拖动 适应各种主流浏览器很好的用户体验度
在Web开发中，表格（table）是展示数据的基础元素。为了提高视觉效果，有时需要在表格表头中添加斜线来区隔不同的表头内容。实现斜线表头有多种方法，下面将详细介绍这五种方法的实现原理和适用场景。 1. 图片背景...
"Table 表格 表头表尾浮动显示" 是一种优化表格用户体验的技术，它允许用户在滚动浏览长表格时，表头（thead）和表尾（tfoot）始终保持可见，方便用户对照和理解数据。这种技术尤其适用于移动端或者空间有限的界面，...
为了解决这个问题，"固定table表头的插件"应运而生。这种插件能够保持表头在页面上的固定位置，无论用户如何滚动，表头始终可见，提高了用户的浏览体验。 在HTML中，实现固定表头通常需要CSS和JavaScript的配合。...
在这个“asp.net html+table固定表头和左侧列.rar”压缩包中，我们聚焦的是如何在HTML表格（Table）中实现固定表头（Fixed Header）和左侧列（Fixed Left Column）的功能，以便在用户滚动页面时，这些关键信息始终...
制作的样式中要求table表头固定，内容滚动，同时checkbox右对齐，支持全选
对于不支持这些特性的老版本浏览器，可能需要使用一些JavaScript库如jQuery Fixed Header Table插件，或者使用传统的方法，如创建重复的表头和第一列，并通过JavaScript同步滚动状态。 总结起来，实现移动端table的...