html 如何让一个表的前几列固定,不随着滚动条移动?

html 如何让一个表的前几列固定,不随着滚动条移动?,第1张

追问: 就是html做的一个table,我一行显示的字段太多了,超出了屏幕,就是想让table的前几列固定,当滚动条左右滑动时,前几列位置不变。有没有现成的属性实现,或者用css?或者js?怎么实现?不知道我描述的是否清楚。 回答: 你把你这个页面的代码发给我 我看一下 就知道你想要什么效果了 追问: 我这个页面代码太复杂了。举个例子把:我想让下面这个table前3列固定<div id = "scrolDiv" style="width: 60%overflow: autocursor: defaultdisplay: inlineposition: absoluteheight: 20%"><table><tr><td colspan = "6" align = "center">商业运行动态</td></tr><tr><td>商业企业</td><td align = "center" width = "10%">到货量</td><td align = "center" width = "10%">分拣打码量</td><td align = "center" width = "10%">零售户退货量</td><td align = "center" width = "10%">商商调剂量</td><td align = "center" width = "10%">库存量</td></tr><tr><td align = "left">北京市烟草公司</td><td align = "right">100.34</td><td align = "right">100.34</td><td align = "right">100.34</td><td align = "right">100.34</td><td align = "right">100.34</td></tr><tr><td align = "left">北京市烟草公司</td><td align = "right">100.34</td><td align = "right">100.34</td><td align = "right">100.34</td><td align = "right">100.34</td><td align = "right">100.34</td></tr></table></div>回答: 你可是想让表格的宽和高都是固定的尺寸?

<!DOCTYPE html>

<html>

<head>

<style type="text/css">

#ball{

position:absolute

left:250px

top:118px

}

</style>

<script language="JavaScript">

var x,y,o

function canMove(e){

e = e || window.event

x=document.body.scrollLeft+e.clientX

y=document.body.scrollTop+e.clientY

ball.style.left=x+20 + "px"

ball.style.top=y + "px"

clearTimeout(o)

o=setTimeout(function(){

canMove(e)

},100)

}

document.onmousemove=canMove  

</script>

</head> 

<body>

<center>

<font face="隶书" size="5" color="blur">

鼠标移动图像跟随效果

</font>

</center>

<div id="ball">

<img src="E:/image/1.jpg" width="20" height="20">

</div>

</body>

</html>

HTML中移动表单的位置需要使用vertical-align:middle还要指定行高 line-height:代码如下<tr><td style=" width:148pxheight:28pxfont-family:微软雅黑font-weight:100font-size:12pxvertical-align:middleline-height:28px" ><span><img src="images/与我相关1.jpg" border=1px></span><font >与我相关</font></td></tr>


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

原文地址: http://outofmemory.cn/zaji/6254410.html

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

发表评论

登录后才能评论

评论列表(0条)

保存