比较height(),innerHeight(),outerHeight()和outerHeight(true)
2015-06-24 12:37
471 查看
对比jq中获取元素高度的几个函数(宽度同解):height(),innerHeight(),outerHeight()和outerHeight(true)。
height():元素内容的高度,即盒模型中的content高度;
innerHeight():content高度+padding上下高度;
outerHeight():content高度+padding上下高度+边框上下高度;
outerHeight(true):content高度+padding上下高度+边框上下高度+margin上下高度;
注意:只有outerHeight()函数可带有参数
height():元素内容的高度,即盒模型中的content高度;
innerHeight():content高度+padding上下高度;
outerHeight():content高度+padding上下高度+边框上下高度;
outerHeight(true):content高度+padding上下高度+边框上下高度+margin上下高度;
注意:只有outerHeight()函数可带有参数
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Document</title> <script src="http://libs.baidu.com/jquery/2.0.0/jquery.min.js"></script> <style> .bb{margin: 5px;border: 10px blue solid ;padding: 100px;} </style> <script> $(function(){ alert($(".bb").height()+" "+$(".bb").innerHeight()+" "+$(".bb").outerHeight()+" "+$(".bb").outerHeight(true)) }) </script> </head> <body> <div style="margin-top:1000px; width:600px;heigth:500px;background: yellow"> <div class="cc" > <div class="bb" style="width:500px;height:500px;background:red"> 5555 </div> </div> </div> </body> </html>
相关文章推荐
- android.util.AndroidRuntimeException: requestFeature() must be called before adding content
- UIBezierPath 的理解 及使用
- Android API Guides - Activities - Fragments
- The type org.xmlpull.v1.XmlPullParser cannot be resolved. It is indirectly referenced from required
- GUI(主)线程与子线程之间的通信
- iOS-Core-Animation-Advanced-Techniques(七)
- iOS-Core-Animation-Advanced-Techniques(六)
- iOS-Core-Animation-Advanced-Techniques(三)
- iOS-Core-Animation-Advanced-Techniques(二)
- iOS-Core-Animation-Advanced-Techniques(一)
- UITableViewCell点击时背景颜色
- 单据UI界面设计开发
- UITable里的分割线
- SharePoint 2013 引发类型为“System.ArgumentException”的异常。 参数名: encodedValue
- iOS 9: UIStackView入门
- 如何让UILabel显示多行,并在结尾显示省略号
- (转载)UIKIt力学教程
- Builder模式
- SQL Server 中master..spt_values的应用
- master.dbo.spt_values