关于元素的offsetHeight、line-htight
最近在做一个自适应高度的加载时的瀑布效果,使用加载完毕后为其一个A容器设置style的高度的方式完成(原高度为0且超出部分裁剪),使用offsetHeight获取其子元素高度(所有子元素高度均相等),完成后,A容器底部总是比预期长了一点。
查了一下资料,发现offsetHeight得到的是元素的整数高度,而我的子元素高度为浮点数且小数第一位大于4,所以我就去看了看子元素各自的高度,发现设置了font-size且未设置line-htight的元素(我设置的大小为14px),其高度会变成x.5,设置line-height为1.5em之后就没问题了(当然前提是font-size为偶数)。
关于元素的offsetHeight、line-htight的更多相关文章
- JS获当前网页元素高度offsetHeight
本文测试的是offsetHeight,获取网页中某元素的高度,单位是像素,获取的类型是整型,可以进行数字运算.如图,网页中的元素本身的高度包括,自身的内容+padding+border,而margin ...
- jquery 对象的 height、innerHeight、outerHeight 的区别以及DOM 元素的 clientHeight、offsetHeight、scrollHeight、offsetTop、scrollTop
前言:jquery 对象的 height.innerHeight.outerHeight,还有 DOM 元素的 clientHeight.offsetHeight.scrollHeight.offse ...
- offsetHeight, clientHeight与scrollHeight的区别
在网上搜了一下,结论非常笼统,讲IE从不讲版本,因此自己做了测试并上传结论.以下结论皆是在标准模式下测试通过的,没有测试quirk模式. clientHeight 大部分浏览器对 clientHe ...
- offsetParent、offsetTop、offsetLeft、offsetWidth、offsetHeight
w3c规范,请戳这里:http://www.w3.org/TR/cssom-view/#dom-htmlelement-offsetparent 一.offsetParent 英文解读: part o ...
- 【全面总结】js获取元素位置大小
[js获取元素位置+元素大小]全面总结 目录 1.关于offset offsetParent(只读) offsetTop(只读) offsetLeft(只读) offsetHeight(只读) off ...
- Bootstrap3 排版-内联文本元素
标记文本 突出显示的文本由于其相关性在另一个上下文中,使用<mark>标记. You can use the mark tag to highlight text. You can use ...
- clientHeight、offsetHeight、scrollHeight、offsetTop、scrollTop
clientHeight:包括padding但不包括border.水平滚动条.margin的元素的高度.对于inline的元素这个属性一直是0,单位px,只读元素. offsetHeight:包括pa ...
- scrollTop、offsetHeight和offsetTop等属性用法详解--转转转
scrollTop.offsetHeight和offsetTop等属性用法详解: 标题中的几个相关相关属性在网页中有这大量的应用,尤其是在运动框架中,但是由于有些属性相互之间的概念比较混杂或者浏览器兼 ...
- offsetTop/offsetHeight scrollTop/scrollHeight 的区别
offsetTop/offsetHeight scrollTop/scrollHeight 这几个属性困扰了我N久,这次一定要搞定. 假设 obj 为某个 HTML 控件. obj.offset ...
随机推荐
- JS window对象 Navigator对象 Navigator 对象包含有关浏览器的信息,通常用于检测浏览器与操作系统的版本。
Navigator对象 Navigator 对象包含有关浏览器的信息,通常用于检测浏览器与操作系统的版本. 对象属性: 查看浏览器的名称和版本,代码如下: <script type=" ...
- 两台群晖之间传输数据NFS
如何在两台局域网的群晖之间传输数据,可以用NFS的方式来实现.摘抄如下,地址http://www.nasyun.com/thread-64638-1-1.html?reload=true 假设要把群晖 ...
- xshell安装错解决方案
之前安装过XShell后来因为各种原因不能使用了,卸载和再次安装的时候安装一直失败.研究了好久终于找到解决方案. 只需要删除在C:\Program Files (x86)\InstallShield ...
- 【代码健壮性】善用data-属性来关联,慎用parent()之类的查找结构
$(".minus,target").unbind().click(function(){ console.log(this); var $thisParent = $(this) ...
- Packet for query is too large (1986748 > 1048576). You can change this value on the server by 异常
场景:mybatis动态拼接,批量添加数据,因为数据太多,凭借过多,导致MySql数据库中插入大于1m的数据时,提示该异常. 解决办法:修改mysql的属性 max_allowed_packet即可. ...
- openFrameworks Download
{ https://openframeworks.cc/zh_cn//download/ } 0.10.1 是最新发布的版本. 这个版本是修改了一些BUG的小版本,与版本 0.10.1100%兼容而且 ...
- 【TCP】SYN攻击
TCP握手协议 在TCP/IP协议中,TCP协议提供可靠的连接服务,采用三次握手建立一个连接.第一次握手:建立连接时,客户端发送syn包(syn=j)到服务器,并进入SYN_SEND状态,等待服务器确 ...
- 【TCP】TCP状态
下图所示,TCP通信过程包括三个步骤:建立TCP连接通道(三次握手).数据传输.断开TCP连接通道(四次挥手). 这里进一步探究TCP三路握手和四次挥手过程中的状态变迁以及数据传输过程.先看TCP状态 ...
- PHP ftp_delete() 函数
定义和用法 ftp_delete() 函数删除 FTP 服务器上的一个文件. 如果成功,该函数返回 TRUE.如果失败,则返回 FALSE 和一个警告. 语法 ftp_delete(ftp_conne ...
- 7、jmeter-定时器介绍与使用
jmeter-定时器介绍与使用 固定定时器 Uniform Random Timer Precise Throughput Timer Constant Throughput Timer 高斯随机定时 ...