关于元素CSS高度的5个概念,一次性搞清楚它们

yumo66610小时前技术文章1

一次分清clientHeight、offsetHeight、scrollHeight、scrollTop、offsetTop概念:

clientHeight:可视的,看得见的部分,content+padding;

offsetHeight:在clientHeight基础上,添加“”边框“”,即content+padding+margin;

scrollTop:超过clientHeight“顶部界线”的部分,即看不见的、已经 滚动出去 的部分;

scrollHeight:“内容”的本身高度;

offsetTop:这个是唯一研究 两个元素之间 关系的,子元素与父元素顶部距离;


相关文章

一个简单的CSS属性助你实现页面的等比例缩放,快来学习一下吧

前言在响应式布局逐渐成为主流的今天,网页或者app的流式布局已经不算是一个新鲜的词汇了。今天我要讲的一个内容也是跟页面流式布局有关,如何让你的网页实现完美的缩放?网页布局我们可以很快速的写出一个响应式...

90%不知道的css常识:元素纵向百分比是相对于宽度不是高度

我调查了身边五六年经验以上的几个前端同学和同事,尽然发现绝大部分人都不知道,当然,在看到这个文章之前,我也不知道这个,平时虽然都一直在做web前端开发,但真没涉及到这块,或者说涉及到了,也解决了,但是...

如何使用CSS创建高级动画,这个函数必须掌握

我们每天都在网上摸鱼,作为前端开发人员,网站上微妙的细节变化通过比别人会更关注。我一直注意到的一件事是网站上的动画的流畅性。动画对于用户体验来说是非常好的,有时我们可以一些有趣的动画来留住用户。创建高...

前端基础知识之“CSS是什么?”(前端基础题库)

“这里是云端源想IT培训,帮你轻松拿offer”嗨~大家好,我是学长今天的你过得还好吗?- 2023.03.07 -女神节到了,所有的女孩都好看,愿我们成为自己的阳光,不需借谁的光!上期给大家分享了关...

用css如何实现三角形(css实现三角形的方法)

在实际编程中我们经常会遇到下拉菜单的下三角和一些特殊的图形,那么这些如何用css来实现呢?例1例2例3原理:仔细想想,原理非常简单,利用CSS的border以及它的属性值transparent来实现三...