left,pixelLeft,posLeft属性

最新推荐文章于 2024-03-18 22:27:58 发布

smartdot_guohr

最新推荐文章于 2024-03-18 22:27:58 发布

阅读量344

点赞数 1

CC 4.0 BY-SA版权

本文链接：https://blog.youkuaiyun.com/smartdot_guohr/article/details/83355977

本文详细介绍了HTML元素的各种尺寸属性及其使用方法，包括clientHeight/clientWidth用于获取内容区域的高度和宽度；clientLeft/clientTop获取边框厚度；scrollLeft/scrollTop获取滚动距离；scrollHeight/scrollWidth获取可滚动范围；style.left、style.pixelLeft、style.posLeft获取元素的定位信息。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

1.clientHeight, clientWidth:
这两个属性大体上显示了元素内容的象素高度和宽度.理论上说这些测量不考虑任何通过样式表加入
元素中的页边距,边框等.

2.clientLeft,clientTop:
这两个返回的是元素周围边框的厚度,如果不指定一个边框或者不定位改元素,他的值就是0.

3.scrollLeft,scrollTop:
如果元素是可以滚动的,可以通过这俩个属性得到元素在水平和垂直方向上滚动了多远,单位是象素.
对于不可以滚动的元素,这些值总是0.

4.scrollHeight,scrollWidth:
不管有多少对象在页面上可见,他们得到的是整体.

5.style.left:
定位元素与包含它的矩形左边界的偏移量

6.style.pixelLeft:
返回定位元素左边界偏移量的整数像素值.因为属性的非像素值返回的是包含单位的字符串,例如,30px. 利用这个属性可以单独处理以像素为单位的数值.

7.style.posLeft:
返回定位元素左边界偏移量的数量值,不管相应的样式表元素指定什么单位.因为属性的非位置值返回的是包含单位的字符串,例如,1.2em

top,pixelTop,posTOp这几个类比就行了.

function move(x) {
if (document.all) {
object1.style.pixelLeft += x;
object1.style.visibility = "visible"}
else if (document.layers) {
document.object1.left += x;
document.object1.visibility = "show"}}