法律咨询微信网站建设,ui设计做兼职的网站有哪些,订做网站,asp网站 底部版权所有在开发报表中#xff0c;如果报表数据行过多页面无法全部显示#xff0c;或者内容溢出div#xff0c;需要把表头和表尾固定表体滚动这样就可以在页面上全部显示#xff0c;并且不会溢出div 效果#xff1a;最终实现效果 代码#xff1a;!DOCTYPE html
html如果报表数据行过多页面无法全部显示或者内容溢出div需要把表头和表尾固定表体滚动这样就可以在页面上全部显示并且不会溢出div 效果最终实现效果 代码!DOCTYPE html
html
headmeta charsetutf-8 /title/titlestyle typetext/css.table-container {height: 200px;overflow-y: auto;}table {width: 100%;table-layout: fixed;border-collapse: collapse;}thead {position: sticky;top: 0;background-color: #fff;}th, td {padding: 8px;border: 1px solid #ccc;}tfoot {position: sticky;bottom: 0;background-color: #fff;}/style
/headbodydiv classtable-containertabletheadtrth表头1/thth表头2/thth表头3/th/tr/theadtbodytrtd rowspan2合并单元格/tdtd内容1/tdtd内容2/td/trtrtd内容3/tdtd内容4/td/trtrtd rowspan2合并单元格/tdtd内容1/tdtd内容2/td/trtrtd内容3/tdtd内容4/td/trtrtd rowspan2合并单元格/tdtd内容1/tdtd内容2/td/trtrtd内容3/tdtd内容4/td/trtrtd rowspan2合并单元格/tdtd内容1/tdtd内容2/td/trtrtd内容3/tdtd内容4/td/trtrtd rowspan2合并单元格/tdtd内容1/tdtd内容2/td/trtrtd内容3/tdtd内容4/td/trtrtd rowspan2合并单元格/tdtd内容1/tdtd内容2/td/trtrtd内容3/tdtd内容4/td/trtrtd rowspan2合并单元格/tdtd内容1/tdtd内容2/td/trtrtd内容3/tdtd内容4/td/trtrtd rowspan2合并单元格/tdtd内容1/tdtd内容2/td/trtrtd内容3/tdtd内容4/td/trtrtd rowspan2合并单元格/tdtd内容1/tdtd内容2/td/trtrtd内容3/tdtd内容4/td/trtrtd rowspan2合并单元格/tdtd内容1/tdtd内容2/td/trtrtd内容3/tdtd内容4/td/trtrtd rowspan2合并单元格/tdtd内容1/tdtd内容2/td/trtrtd内容3/tdtd内容4/td/trtrtd rowspan2合并单元格/tdtd内容1/tdtd内容2/td/trtrtd内容3/tdtd内容4/td/tr!-- 更多行... --/tbodytfoottrtd1/tdtd2/tdtd3/td/tr/tfoot/table/div/body
/html
