了解HTML高度是按样式还是按内容设置

问题描述

我有2个div：

I have 2 divs:

<div id="div1"></div>
<div id="div2">div2</div>​

我的CSS：

in my css:

#div1{ height:20px}​

这两个div都有20px的高度，请检查

如何查看div是否因内容或已设置为css或内联样式而具有高度？

这可以帮助我找出开发者或刚刚由浏览器计算。

Both divs have 20px height, check demo
How can I find out if the div have it's height due to content or have been set in css or inline style?
This helps me find out the dimensions have been set by the developer or just calculated by the browser.

推荐答案

我找到了实现它的方法：）
$ b

I found a way to achieve it :)

function getRealHeight(element){
    var height=0;
    if (element.children().length>0){
        var temp = $('<div></div>');
        temp.append(element.children());
        height = element.height();
        element.append(temp.children());
    } else {
        var html=element.html();
        element.html('');
        height = element.height();
        element.html(html);
    }
    return height;
}

这篇关于了解HTML高度是按样式还是按内容设置的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持！