首页 > 其他分享 >原生表格纵向滚动条

原生表格纵向滚动条

时间:2022-12-22 14:03:40浏览次数:34  
标签:原生 表格 tbody 表头 滚动条 内容


 原生表格纵向滚动条

<!doctype html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<!--原生表格纵向滚动条-->
<style> td, th {
width: 1%; /*平均单元格宽度*/
}

tbody {
overflow-y: auto;
}

thead, tbody {
display: block;
}

table, tbody {
height: 100px; /*正文表格高度*/
}</style>
<title>原生表格纵向滚动条</title>
</head>
<body>
<table>
<thead>
<tr>
<td>表头1</td>
<td>表头2</td>
</tr>
</thead>
<tbody>
<tr>
<td>内容1</td>
<td>内容2</td>
</tr>
<tr>
<td>内容1</td>
<td>内容2</td>
</tr>
<tr>
<td>内容1</td>
<td>内容2</td>
</tr>
<tr>
<td>内容1</td>
<td>内容2</td>
</tr>
<tr>
<td>内容1</td>
<td>内容2</td>
</tr>
<tr>
<td>内容1</td>
<td>内容2</td>
</tr>
<tr>
<td>内容1</td>
<td>内容2</td>
</tr>
<tr>
<td>内容1</td>
<td>内容2</td>
</tr>
</tbody>
</table>
</body>
</html>

标签:原生,表格,tbody,表头,滚动条,内容
From: https://blog.51cto.com/u_15920212/5962848

相关文章

  • HTML-表格-2022-12-22
    <!DOCTYPEhtml><htmllang="en"><head><metacharset="UTF-8"><title>表格学习</title></head><body><!--表格tabletr行td列--><tableborder="1px"><tr><!......
  • JavaScript原生代码处理JSON的一些高频次方法合集
    letjson={/**判断JSON格式*/isJSON:function(str){if(typeofstr=="string"){try{varobj=JSON.parse(str);......
  • fastadmin修改导出时,图片大小以及表格高度的问题
    1、在public/assets/js/require-table.js 中找到 exportOptions:{  }这个json2、将以下代码放入放入其中onBeforeSaveToFile:function(data,fileName,type,ch......
  • 如何在Word表格中拆分或合并单元格?
    我们在使用Word制作表格时,由于表格较为复杂,只是简单的插入行、列并不能满足我们的需要。要做一个完整的表格,很多时候需要将单元格进行拆分或者合并,才能达到我们想要的效果......
  • 如何在云原生环境中实现安全左移?
    在过去几年里,勒索软件一直是企业安全团队关心的头等大事,而当前软件漏洞问题数量也在逐渐抬头。基于云的应用程序和服务的爆发式增长以及数字化工作的增加,对黑客来说是一大......
  • 快应用VS原生APP,优势在哪里?
    在目前互联网技术迅猛发展的情况下,正所谓一山不容二虎。头部互联网企业以及手机厂商两大阵营正斗得不可开交。像是腾讯、阿里、百度、今日头条等头部互联网企业,都关注于小程......
  • 华为云解锁云原生数据库发展新动能
    摘要:如流水般源源不断的数据都存放在哪里?云原生数据库到底是什么?企业基于云原生数据库如何随取随用,实现从“上好云”到“用好云”的跨越发展?本文分享自华为云社区《​​......
  • 华为云解锁云原生数据库发展新动能
    摘要:如流水般源源不断的数据都存放在哪里?云原生数据库到底是什么?企业基于云原生数据库如何随取随用,实现从“上好云”到“用好云”的跨越发展?本文分享自华为云社区《探......
  • 强化学习(四):基于表格型动态规划算法的强化学习
    强化学习(四):基于表格型动态规划算法的强化学习​  在有限马尔可夫决策过程中,智能体在某个状态进行决策的过程中,始终满足价值函数和动作函数的贝尔曼方程,事实上,这就是一种动......
  • 亚马逊云科技北京巡演——构建云原生端到端的数据战略
    昨天,re:Invent2022中国行线下城市巡展暨INNOVATE线上大会已正式盛大开启!北京、上海两地同步率先启动,为大家展示了2022re:Invent全球大会的最新产品和技术、前沿趋势以及最......