<HTML>

<HEAD>

<TITLE>textarea宽度、高度自动适应处理方法</TITLE>

<!-- 控制宽度的自动适应 -->

<style type="text/css">

.comments {

width:100%;/*自动适应父布局宽度*/

overflow:auto;

word-break:break-all;

/*在ie中解决断行问题(防止自动变为在一行显示，主要解决ie兼容问题，ie8中当设宽度为100%时，文本域类容超过一行时，

当我们双击文本内容就会自动变为一行显示，所以只能用ie的专有断行属性“word-break或word-wrap”控制其断行)*/

}

</style>

</HEAD> 

<BODY>

<FORM METHOD=POST ACTION= " ">

<!-- 主要控制高度的自动适应 --> 

<!-- 第一个是普通textarea -->

<textarea class="comments" rows="10" cols="10"> </textarea>

<!-- 以下两种方式都可以解决textarea行高自动适应类容的高度 -->

<textarea class="comments" rows=1 name=s1 cols=27 onpropertychange= "this.style.posHeight=this.scrollHeight "></textarea> 

<textarea class="comments" style="height:expression((this.scrollHeight>150)?'150px':(this.scrollHeight+5)+'px');overflow:auto;"></textarea>

</FORM>

</BODY>

</HTML>

textarea文本域宽度和高度width及height自动适应实现代码的更多相关文章

  1. textarea文本域宽度和高度（width、height）自己主动适应变化处理

    文章来源:http://www.cnblogs.com/jice/archive/2011/08/07/2130069.html <HTML> <HEAD> <TITLE ...

  2. div模拟textarea文本域轻松实现高度自适应

    <!doctype html> <html lang="en"> <head> <meta charset="UTF-8&quo ...

  3. div模拟textarea文本域轻松实现高度自适应——张鑫旭

    by zhangxinxu from http://www.zhangxinxu.com本文地址:http://www.zhangxinxu.com/wordpress/?p=1362 一.关于tex ...

  4. textarea文本域轻松实现高度自适应

    转载:http://www.xuanfengge.com/textarea-on-how-to-achieve-a-high-degree-of-adaptive.html 今天需要些一个回复评论的页 ...

  5. jquery之div模拟textarea文本域轻松实现高度自适应

    <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title> ...

  6. CSS3：固定textarea文本域宽度

    textarea在一些浏览器上可以被拖拉改变大小,为了保持美观,可以通过 CSS3 resize 属性禁掉 textarea{resize:none; //不允许用户调整元素大小}

  7. 使用contenteditable+div模拟textarea文本域实现高度自适应

    使用contenteditable+div模拟textarea文本域实现高度自适应 开发过程中由于需要在发送消息的时候需要有一个可以高度自适应的文本域,一开始是使用textarea并搭配auto-si ...

  8. css之——div模拟textarea文本域的实现

    1.问题的出现: <textarea>标签为表单元素,但一般用于多行文本的输入,但是有一个明显的缺点就是不能实现高度自适应,内容过多就回出现滚动条. 为了实现高度自适应:用div标签来代模 ...

  9. textarea文本域的高度随内容的变化而变化

    用css控制textarea文本域的高度随内容的变化而变化,不出现滚动条. CSS代码: 复制代码 代码如下: .t_area{ width:300px; overflow-y:visible } & ...

随机推荐

  1. C# string.join

    String.Join 方法 平常工作中经常用到string.join()方法,在vs 2017用的运行时(System.Runtime, Version=4.2.0.0)中,共有九个(重载)方法. ...

  2. apache做反向代理服务器

    apache代理分为正向代理和反向代理: 1 正向代理: 客户端无法直接访问外部的web,需要在客户端所在的网络内架设一台代理服务器,客户端通过代理服务器访问外部的web(需要在客户端的浏览器中设置代 ...

  3. <pre>标签的基本样式设置

    断行 在html中,换行符无法在一般标签内作为布局控制显示,包括xml实体 和 均表现为white-space,仅用于断字[1]. 一般情形下,可使用<br>标签断行:但需要从原始xml文 ...

  4. 装机uefi问题

    1 uefi不支持普通winpe启动,需要改为legacy 2 七代酷睿不支持win10以下版本 3 装机后无法启动是因为隐藏分区问题,删除掉,最好整个硬盘格式化 4 老毛桃一键装机不可以时,改为虚拟 ...

  5. zepplin0.7.2报错ERROR, exception: null, result: %text java.lang.NullPointerException的处理

    zepplin0.7.2报错ERROR, exception: null, result: %text java.lang.NullPointerException的处理 问题描述: 使用zeppli ...

  6. 文件缓存tmpfs简单使用

    文件缓存tmpfs基于内存的文件系统,直接使用ram(物理内存)+swap(交换分区) tmpfs缓存文件系统/dev/shm共享内存动态的使用虚拟内存,文件删除后释放内存 特性:1.动态空间使用和动 ...

  7. Linux内存使用调整

    前段时间在做播放器的时候,遇到个问题,花了很长时间,做个记录,希望对有需要的人有所帮助: 播放器的播视频的时候,无论是手动切换视频还是到视频播放完成,自动切换视频,一定次数后均出现黑屏现象,偶尔有声音 ...

  8. <转载>ford-fulkerson算法2

    原文链接https://www.cnblogs.com/luweiseu/archive/2012/07/14/2591573.html 作者:wlu 7. 网络流算法--Ford-Fulkerson ...

  9. [转]golang中defer的使用规则

    转载于:https://studygolang.com/articles/10167 在golang当中,defer代码块会在函数调用链表中增加一个函数调用.这个函数调用不是普通的函数调用,而是会在函 ...

  10. sublime text3 golang插件(golang build)

    1 前言 先前条件: sublime text3:下载地址:http://www.sublimetext.com/3 golang:下载地址:https://golang.google.cn/dl/ ...