站长资源网页制作

css textarea 高度自适应,无滚动条

整理:jimmy2024/12/26浏览2
简介用css控制textarea文本域的高度随内容的变化而变化,不出现滚动条. CSS代码: 复制代码代码如下: .t_area{ width:300px; overflow-y:visible }
提示:您可以先修改部分代码再运行
css实现版本(不能在标准页面中执行,已经就是不能加
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">


复制代码代码如下:
<title>文本域自适应高度</title>
<textarea style="width:300px;overflow-y:visible">在这里输入一些字符看一下,当超出初设的文本域高度时,文本域自动伸缩变高。


另一个js版本textarea自适应高度
项目中要求textarea自适应高度,在网上找到这个很好的方法 。记录下来以后备用。

复制代码代码如下:
function BodyOnLoad()
{
var textarea= document.getElementById("textarea");
textarea.style.posHeight=textarea.scrollHeight;
}

scrollHeight:获取对象的滚动高度。
posHeight:设置或获取以 height 标签属性指定的单位的对象高度。
把方法加在body的onload事件上
<body onload = "BodyOnLoad();">
综上所述,兼容性什么的用css实现的稍微好点,但是非标准情况下,才可以。

上一篇:使用CSS给图片添加阴影的方法

下一篇:网页选项卡TAB设计原则和应用案例教程