HTML下的table滚动实现

HTML下的table滚动实现,第1张

1、首先打开myeclipse获取idea这样的编辑器,在编辑器中写一个table标签,这里给出table的值。

2、然后可以在页面中看到此时展示的是没有样式的table样板,此时所有的数据没有经过渲染,比较紧凑,也不是一个页面展示。

3、可以在table中引入样式标签style来设计table的样式。

4、还可以使用内部元素,使用jquery ,在jquery中首先给table一个class属性,在JavaScript中通过.class属性获取这个table,给出样式设计。

5、根据上面的设计再经过背景、宽度、高度的设计,可以设计出一个比较好看的table。

单元格里一样的设置 css 属性

<style type="text/css">

table.scrollable td { overflow: scroll}

</style>

<table class="scrollable">

<tr><td>.....</td></tr>

</table>

如果我的回答没能帮助您,请继续追问。

<style type="text/css">

<!--

#Layer1 {

position:absolute

width:196px

height:198px

z-index:1

overflow-x:hidden

overflow-y:scroll

}

-->

</style>

<table width="400" height="400" border="1" align="center" cellpadding="0" cellspacing="0">

<tr bgcolor="#999966">

<td width="100" height="100"></td>

<td width="200" height="100"></td>

<td width="100" height="100"></td>

</tr>

<tr>

<td width="100" height="200" bgcolor="#999966"></td>

<td width="200" height="200" align="left" valign="top"><div id="Layer1">文字内容文字内容文字内容文字内容文字内容文字内容文字内容文字内容文字内容文字内容文字内容文字内容文字内容文字内容文字内容文字内容文字内容文字内容文字内容文字内容文字内容文字内容文字内容文字内容文字内容文字内容文字内容文字内容文字内容文字内容文字内容文字内容文字内容文字内容文字内容文字内容文字内容文字内容文字内容文字内容文字内容文字内容文字内容文字内容文字内容文字内容文字内容文字内容文字内容文字内容文字内容文字内容文字内容文字内容文字内容文字内容文字内容文字内容文字内容文字内容文字内容文字内容文字内容文字内容文字内容文字内容文字内容文字内容文字内容文字内容文字内容文字内容文字内容文字内容文字内容文字内容文字内容文字内容文字内容文字内容文字内容文字内容 </div></td>

<td width="100" height="200" bgcolor="#999966"></td>

</tr>

<tr bgcolor="#999966">

<td width="100" height="100"></td>

<td width="200" height="100"></td>

<td width="100" height="100"></td>

</tr>

</table>


欢迎分享,转载请注明来源:内存溢出

原文地址:https://54852.com/zaji/7485754.html

(0)
打赏 微信扫一扫微信扫一扫 支付宝扫一扫支付宝扫一扫
上一篇 2023-04-06
下一篇2023-04-06

发表评论

登录后才能评论

评论列表(0条)

    保存