HTML5里面自动适应手机屏幕的高度方法：
使用meta标签，这也是普遍使用的方法
<meta name="viewport" content="width=device-width,initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0, user-scalable=no"/>解释该标签的含义：
height=device-width 就是设置页面的高度，为手机的高度
代码如下：
var width = document.documentElement.clientWidth
//初始化高度
$("#iFrame1").height(width*0.5)
//当文档窗口发生改变时 触发
$(window).resize(function(){
$("#iFrame1").height(width*0.5)
})
一、使用textarea标签进行多行文本的输入有很多限制，比如不能实现高度自适应，会出现难看的滚动条等问题。HTML5中添加了一个新属性contenteditable，该属性可以让input,textarea以外的不可编辑的标签具备可编辑功能；
用法如下：
//contenteditable="true"当属性值为true的时候，可编辑标签内可以写入标签，对于复制的具有样式的内容，其样式会保留；
<div contenteditable="true">我是可编辑的富文本框</div>
//contenteditable="plaintext-only"当属性值为plaintext-only时，该可编辑标签内只能写入纯文本的数据，对于复制的具有样式的内容，会转换为纯文本，而将样式标签等内容过滤掉；
<div contenteditable="plaintext-only"></div>
二、如果不使用该属性，可以使用js控制textarea的高度；原理是当textarea出现滚动条时，增加其高度，使滚动条消失。
怎样判断是否出现滚动条，其方法是但元素的scrollHeight大于offsetHeight的时候，即出现了滚动条；
实现方法如下：
//html
<textarea id="text"></textarea>
//css
#text{
font-size: 20px
overflow: hidden//必须
}
//js
$('#text').on('input',function(){
if(text.scrollHeight>text.offsetHeight){
THeight += 20//font-size的大小是20，因此每次给textarea的高度增加20px
$('#text').css('height',THeight)
}
})
