可以滚动的表格

最新推荐文章于 2022-08-14 22:30:24 发布
最新推荐文章于 2022-08-14 22:30:24 发布
阅读量90 收藏
点赞数
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/fengkuangshl/article/details/84320696
版权 

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
 <head>
  <title> New Document </title>
  <style>
html { font-size:12px; }
/*body { margin:50px; }*/
.clearfix:after { content:'\0020'; display:block; height:0; clear:both; }
.clearfix { *zoom:1;}
.clearfix,.question{border:solid 1px #3CF; margin:0; padding:0;}
.clearfix{  border-bottom:none; border-right:none;}
.clearfix{ width:501px;}
.question{ width:500px; height:27px;line-height:26px; border-top:none; border-left:none; float:left; display:inline;overflow-y:auto;word-wrap: break-word; word-break: break-all;text-align: center; }
/*div{border:1px #686868 solid; margin-top:50%}*/

.clearfixans:after { content:'\0020'; display:block; height:0; clear:both; }
.clearfixans { *zoom:1;}
.clearfixans,.ans{border:solid 1px #3CF; margin:0; padding:0;}
.clearfixans{  border-bottom:none; border-right:none;}
.ans{width:100px; height:27px;line-height:26px; border-top:none; border-left:none; float:left; display:inline;overflow-y:auto;word-wrap: break-word; word-break: break-all;text-align: center;}
</style>
 </head>

 <body>
<div >
<div style="float:left;">
<ul class="clearfix">
<li class="question">
                                                 问题列表 
</li>

<li class="question">
                                                 我是电话回访人员，工号xxx。您近期购买了XX（等）保险产品，现在和您做一次售后录音电话回访，大概需要3分钟时间，您看方便吗？
</li>

<li class="question">
                                                 请问您投保前是否已经阅读并理解投保提示的内容呢？
</li>

<li class="question">
                                                 您签收保单后有10天犹豫期，如果解约，将在扣除10元工本费后退还您的保费；之后解约，您会有一些损失。您了解吗？
</li>

<li class="question">
                                                 请问投保单上的风险提示语句是您亲笔抄写的吗？
</li>

<li class="question">
                                                 请问投保单上的风险提示语句是您亲笔抄写的吗？
</li>

<li class="question">
                                                 请问投保单上的风险提示语句是您亲笔抄写的吗？
</li>

<li class="question">
                                                 请问投保单上的风险提示语句是您亲笔抄写的吗？
</li>

<li class="question">
                                                 请问投保单上的风险提示语句是您亲笔抄写的吗？
</li>

<li class="question">
                                                 请问投保单上的风险提示语句是您亲笔抄写的吗？
</li>

<li class="question">
                                                 请问投保单上的风险提示语句是您亲笔抄写的吗？
</li>

<li class="question">
                                                 请问投保单上的风险提示语句是您亲笔抄写的吗？
</li>

</ul>
</div>
<div style="width:400px;overflow-x:auto;overflow-y:hidden;">
<ul class="clearfixans" style="width:808px;" >



                                         <li class="ans">
                                            220000900344984
                                            </li>


                                         <li class="ans">
                                            220000900344984
                                            </li>


                                         <li class="ans">
                                            220000900344984
                                            </li>


                                         <li class="ans">
                                            220000900344984
                                            </li>


                                         <li class="ans">
                                            220000900344984
                                            </li>


                                         <li class="ans">
                                            220000900344984
                                            </li>


                                         <li class="ans">
                                            220000900344984
                                            </li>


                                         <li class="ans">
                                            220000900344984
                                            </li>




                                         <li class="ans">
                                            方便
                                            </li>


                                         <li class="ans">
                                            方便
                                            </li>


                                         <li class="ans">
                                            方便
                                            </li>


                                         <li class="ans">
                                            方便
                                            </li>


                                         <li class="ans">
                                            方便
                                            </li>


                                         <li class="ans">
                                            方便
                                            </li>


                                         <li class="ans">
                                            方便
                                            </li>


                                         <li class="ans">
                                            方便
                                            </li>




                                         <li class="ans">
                                            -
                                            </li>


                                         <li class="ans">
                                            否
                                            </li>


                                         <li class="ans">
                                            -
                                            </li>


                                         <li class="ans">
                                            -
                                            </li>


                                         <li class="ans">
                                            -
                                            </li>


                                         <li class="ans">
                                            否
                                            </li>


                                         <li class="ans">
                                            -
                                            </li>


                                         <li class="ans">
                                            -
                                            </li>




                                         <li class="ans">
                                            不了解
                                            </li>


                                         <li class="ans">
                                            不了解
                                            </li>


                                         <li class="ans">
                                            -
                                            </li>


                                         <li class="ans">
                                            -
                                            </li>


                                         <li class="ans">
                                            不了解
                                            </li>


                                         <li class="ans">
                                            不了解
                                            </li>


                                         <li class="ans">
                                            -
                                            </li>


                                         <li class="ans">
                                            -
                                            </li>




                                         <li class="ans">
                                            是
                                            </li>


                                         <li class="ans">
                                            否
                                            </li>


                                         <li class="ans">
                                            是
                                            </li>


                                         <li class="ans">
                                            否
                                            </li>


                                         <li class="ans">
                                            是
                                            </li>


                                         <li class="ans">
                                            否
                                            </li>


                                         <li class="ans">
                                            是
                                            </li>


                                         <li class="ans">
                                            否
                                            </li>




                                         <li class="ans">
                                            是
                                            </li>


                                         <li class="ans">
                                            否
                                            </li>


                                         <li class="ans">
                                            是
                                            </li>


                                         <li class="ans">
                                            否
                                            </li>


                                         <li class="ans">
                                            是
                                            </li>


                                         <li class="ans">
                                            否
                                            </li>


                                         <li class="ans">
                                            是
                                            </li>


                                         <li class="ans">
                                            否
                                            </li>




                                         <li class="ans">
                                            是
                                            </li>


                                         <li class="ans">
                                            否
                                            </li>


                                         <li class="ans">
                                            是
                                            </li>


                                         <li class="ans">
                                            否
                                            </li>


                                         <li class="ans">
                                            是
                                            </li>


                                         <li class="ans">
                                            否
                                            </li>


                                         <li class="ans">
                                            是
                                            </li>


                                         <li class="ans">
                                            否
                                            </li>




                                         <li class="ans">
                                            是
                                            </li>


                                         <li class="ans">
                                            否
                                            </li>


                                         <li class="ans">
                                            是
                                            </li>


                                         <li class="ans">
                                            否
                                            </li>


                                         <li class="ans">
                                            是
                                            </li>


                                         <li class="ans">
                                            否
                                            </li>


                                         <li class="ans">
                                            是
                                            </li>


                                         <li class="ans">
                                            否
                                            </li>




                                         <li class="ans">
                                            是
                                            </li>


                                         <li class="ans">
                                            否
                                            </li>


                                         <li class="ans">
                                            是
                                            </li>


                                         <li class="ans">
                                            否
                                            </li>


                                         <li class="ans">
                                            是
                                            </li>


                                         <li class="ans">
                                            否
                                            </li>


                                         <li class="ans">
                                            是
                                            </li>


                                         <li class="ans">
                                            否
                                            </li>




                                         <li class="ans">
                                            是
                                            </li>


                                         <li class="ans">
                                            否
                                            </li>


                                         <li class="ans">
                                            是
                                            </li>


                                         <li class="ans">
                                            否
                                            </li>


                                         <li class="ans">
                                            是
                                            </li>


                                         <li class="ans">
                                            否
                                            </li>


                                         <li class="ans">
                                            是
                                            </li>


                                         <li class="ans">
                                            否
                                            </li>




                                         <li class="ans">
                                            是
                                            </li>


                                         <li class="ans">
                                            否
                                            </li>


                                         <li class="ans">
                                            是
                                            </li>


                                         <li class="ans">
                                            否
                                            </li>


                                         <li class="ans">
                                            是
                                            </li>


                                         <li class="ans">
                                            否
                                            </li>


                                         <li class="ans">
                                            是
                                            </li>


                                         <li class="ans">
                                            否
                                            </li>




                                         <li class="ans">
                                            是
                                            </li>


                                         <li class="ans">
                                            否
                                            </li>


                                         <li class="ans">
                                            是
                                            </li>


                                         <li class="ans">
                                            否
                                            </li>


                                         <li class="ans">
                                            是
                                            </li>


                                         <li class="ans">
                                            否
                                            </li>


                                         <li class="ans">
                                            是
                                            </li>


                                         <li class="ans">
                                            否
                                            </li>

</ul>            

</div>

</div>
 </body>
</html>
fengkuangshl
关注
  • 0
    点赞
  • 踩
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
js 实现 滚动的表格
03-31
js 实现 滚动的表格! 值得下载看看!资源免费,大家分享!!
表格滚动
qq_40417326的博客
02-18 195
制作滚动表格，循环列表表格内容
weixin_58544706的博客
08-14 1105
滚动表格
Swing表格组件——创建可以滚动的表格
qq_41978199的博客
06-21 4081
package jtable;import java.awt.BorderLayout;import javax.swing.JFrame;import javax.swing.JScrollPane;import javax.swing.JTable;/* * 表格组件 * 利用JTable类直接创建表格 * 表格是最常用的数据统计形式之一，在swing中由 JTable类实现表格。 * 创建表...
vue表格自动滚动
01-08
安装依赖 npm install vue-seamless-scroll --save main.js文件里面引入使用 import scroll from 'vue-seamless-scroll' Vue.use(scroll) html代码 css代码 .seamless-warp { height: 500px;...
前端滚动式表格
03-21
这些库提供了丰富的组件和API，用于构建高度定制的滚动表格。例如，React中可以使用`react-virtualized`或`material-ui`的`Table`组件；Vue则有`Element UI`的`el-table`，以及`Vuetify`的`v-data-table`等。这些...
滚动表格
04-20
滚动表格通常用于处理大量数据，当数据无法一次性完全展示时，用户可以通过滚动条查看所有信息。这个技术在现代网页设计中非常常见，尤其在数据密集型应用中，如报表、数据分析和管理界面。 描述中提到的博文链接...
仿excel可滚动表格代码
06-24
"仿excel可滚动表格代码"是一个项目，旨在实现这样的功能，允许用户在网页上查看和操作大量数据时保持表格头部的列名固定，而内容部分可以水平或垂直滚动。以下将详细介绍这一技术实现的关键点。 首先，我们需要...
jsp中为表格添加水平滚动条的方法
10-21
在网页设计中，有时我们需要在表格中添加水平滚动条以便在数据过多时用户可以方便地浏览。在JSP（JavaServer Pages）中，这可以通过HTML和CSS，以及可能的JavaScript来实现。以下是一个详细的步骤来解释如何在jsp...
marquee效果去掉两端空白的区域实现效果连续
iteye_17313的博客
02-25 1368
    在我们使用marquee实现跑马灯效果时，在两端总是出现许多空白的区域，而文字或图片想要在出现时必须把空白的区域跑完之后才能出现，这样的效果看起来感觉非常的麻烦，在给客户多项目时有的一些客户或公司强制要求必须把文字或图片连续，这样的话我们只单独的使用&lt;marquee&gt;标签就没法达到效果了；    从网上搜索了很多，最后终于找到了相关的解决方法，分享如下案例：&lt;script...
纯css实现内容可滚动的表格
议军饷
08-17 4102
实现纯css实现内容可滚动的表格，需要将表格的内容（tbody，tr，thead，td等元素的display属性设为block） 表格的HTML代码 &lt;table class="scrollTable"&gt; &lt;thead&gt; &lt;tr&gt; &lt;th class="field1Th"&gt;field1Th&lt;/th&gt; &lt;th c
使用动画实现滚动表格
qq_33203555的博客
02-21 1146
一、需求 在一些大屏项目中，需要使用到表格行数据滚动。本文介绍在vue项目中使用动画实现滚动表格。 vue代码如下 <template> <div style="cursor: default;margin:9px 10px 18px"> <div class="table-header table-row"> <div class="table-cell" style="width: 25%">计划名称</div>
【转载】<marquee>标签去除空白代码
蕉下客
07-13 2120
原来一直用标签,就是有空白,不美观,当然如果不在意那段空白的还是推荐标签,短小效率高. 去网上搜了下,有好多,下面的比较好用.贴上来以备不时之需 向上：                                    var speed=30  demo2.innerHTML=demo1.innerHTML  function Marquee(){  if(demo2.offsetTop-
html 控制表格Tbody内容滚动
typeof_yaco的博客
12-20 3856
html里面表格是不容易控制的元素，我在项目中遇到过想让tbody内容超出后滚动，我尝试了很多办法，比如把thead设置position：absolute；再设置top啊，margin啊。。。都感觉不太好。 直接设置tbody  overflow：scroll / auto； 是不管用的，要把 thead 和 tbody 都设置display：block； tbody
HTML无缝滚动的表格
MZ_的博客
08-31 4354
1、表格滚动效果 2、实现原理 1)、最外层是一个class为scrollBody的div，里面有8个ul（ABCDEFGH），每行是一个ul，ul里面是两个li，用div>ul>li这 种结构模拟表格。 2)、每个ul使用绝对定位的样式，每次触发定时器函数的时候，设置每个ul的位置。（并没有删除或者添加dom元...
js实现表格滚动
weixin_44436093的博客
02-20 2913
&lt;!DOCTYPE html&gt; &lt;html lang="en"&gt; &lt;head&gt; &lt;meta charset="UTF-8"&gt; &lt;title&gt;Document&lt;/title&gt; &lt;style type="text/css"
带滚动条的表格
Coding a Life
07-22 5640
有时候需要使用表格来展示一些数据，通常有两种方式：分页和全量。 全量展示时，如果数据量大，表格就会非常的长，视觉和使用效果都很差。 如果表格可以固定长度，内容可以上下滚动，且标题不动，这样看起来就好多了。 那么该如何实现呢？这里想到了一种方法，即表格内部再嵌入一个表格，内部固定高度，以达到滚动的效果。 示例代码如下： table {
pyecharts滚动表格
最新发布
06-25
PyEcharts是一个基于ECharts的Python图表库，它可以帮助开发者轻松地在Python应用程序中创建各种图表，包括交互式的滚动表格。在PyEcharts中，你可以使用`Scatter`或`Timeline`等组件来模拟滚动效果，特别是对于数据...
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值