textarea自动高度

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">

<html>

<head>

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

    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />

<!--/*    <meta name="Generator" content="EditPlus">

    <meta name="Author" content="">

    <meta name="Keywords" content="">

    <meta name="Description" content="">*/-->

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

  <style type="text/css">

      .comments {

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

       overflow:auto;

       word-break:break-all;/*在ie中解决断行问题(防止自动变为在一行显示，主要解决ie兼容问题，ie8中当设宽度为100%时，文本域类容超过一行时，当我们双击文本内容就会自动变为一行显示，所以只能用ie的专有断行属性"word-break或word-wrap"控制其断行)*/

      }

      .t_global {

      width:100%;

      }

      .t_left {

 width:80px;

 background-color: #CCC;

      }

      </style>

  </HEAD>

<BODY>

    <table class="t_global">

        <tr>

            <td class="t_left">审核意见：</td>

            <td>

                <FORM   METHOD=POST   ACTION= " ">

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

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

              </FORM>

            </td>

        </tr>

        <tr>

            <td class="t_left">审核意见：</td>

            <td>

                <FORM   METHOD=POST   ACTION= " ">

                    <!-- textarea行高自动适应类容的高度2 -->

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

              </FORM>

            </td>

        </tr>

        <tr>

            <td class="t_left">审核意见：</td>

            <td>

                <FORM   METHOD=POST   ACTION= " ">

                    <!-- textarea行高自动适应类容的高度3 -->

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

                </FORM>

            </td>

        </tr>

    </table>

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

</BODY>

</HTML>

textarea宽度、高度自动适应处理方法的更多相关文章

  1. textarea 实现高度自动增长

    有时候希望textarea 能够自动调整高度来适应输入的内容 网上看到了很多解决方案,比如动态创建一个隐藏的div,当用户输入的时候将textarea的内容绑定到div,由于div的高度会自动撑开,因 ...

  2. CSS样式实现溢出超出DIV边框宽度高度的内容自动隐藏方法

    CSS样式实现溢出超出DIV边框宽度高度的内容自动隐藏方法 平时我们布局时候,有的文字内容多了会超过溢出我们限制的高度,有的图片会撑破DIV,让网页错位变乱. 这样我们就需要解决如何使用CSS来超出设 ...

  3. CSS，让100%的宽度，自动减10，让100%的高度，自动减10，可以加减乘除

    CSS,让100%的宽度,自动减10,让100%的高度,自动减10,可以加减乘除 实例: .add{ width: calc(100% - 10px); height: calc(100% - 10p ...

  4. textarea高度自动增高

    <!--随着textarea 输入内容 自动增加高度--> <script type="text/javascript"> $(".input_t ...

  5. 纯CSS实现侧边栏/分栏高度自动相等

    by zhangxinxu from http://www.zhangxinxu.com本文地址:http://www.zhangxinxu.com/wordpress/?p=694 一.为何要分栏高 ...

  6. cell高度自动适应文章内容

    效果: 描述:表视图中生成多个不同的cell,cell的高度跟文字内容的多少有关 要求:需要自己在网上下载一个plis文件,然后修改两个标题 一 : 创建工程文件UIAutomaticCellHeig ...

  7. 第一百六十六节，jQuery，基础 DOM 和 CSS 操作，元素内容，元素属性，css和class，元素宽度高度、偏移、滚动条

    jQuery,基础 DOM 和 CSS 操作,元素内容,元素属性,css和class,元素宽度高度.偏移.滚动条 学习要点: 1.DOM 简介 2.设置元素及内容 3.元素属性操作 4.元素样式操作 ...

  8. 简单实现一个textarea自适应高度

    textarea自适应的实现方法很多,原理其实比较简单:监听textarea的input或者键盘事件,获取元素的scrollHeight,重置textarea元素的高度. 预览地址:textarea ...

  9. textarea自适应高度

    最近做项目遇见了这个自适应高度的问题,也在网上找了些资料,大多选择用DIV模拟textarea,但是这样就有安全性的问题,因为你是可以直接将HTML代码输入进去的. 接下来介绍的这种办法是采用两个te ...

随机推荐

  1. Lambda表达式（C语言-gcc编译器）

    前言 先来啰嗦几句,身边的朋友,同事都喜欢在博客上记录自己在学习计算机编程技术路程上的一些问题和心得.就我个人而言,这是个好习惯,特别是在计算机编程领域,技术方向种类繁多,永无止境.所以,我也开始我人 ...

  2. js局部变量与全局变量

    在最外层定义的是全局变量 如果在函数内部不用var声明直接赋值的变量,那么这个变量也是全局变量 在函数内部用var声明的变量叫做局部变量 定义在最开头的全局变量在整个js范围内都可以访问到,都可以使用 ...

  3. C# ado.net 使用 row_number over() 简单的分页示例

    /// <summary> /// 获取Paging列表 /// </summary> public List<HousesAgentEntity> GetPage ...

  4. 趣拍proguard配置

    # Add project specific ProGuard rules here.# By default, the flags in this file are appended to flag ...

  5. EF的TransactionScope

    TransactionScope是一个分布式事务的语句块,被包含起来的语句一起被提交,当出现异常,一起回滚,这都是托管的 当Web没有开启MSDTC服务时候会出现:

  6. 周末充电之WPF（三 ） .后台动态生成控件

    布局 -连连看: 代码: private void Window_Loaded_1(object sender, RoutedEventArgs e) { //动态创建行 ; i < ; i++ ...

  7. Solr配置与简单Demo

    简介: solr是基于Lucene Java搜索库的企业级全文搜索引擎,目前是apache的一个项目.它的官方网址在http://lucene.apache.org/solr/  .solr需要运行在 ...

  8. 淘宝开源Web服务器Tengine安装教程

    简介Tengine是由淘宝核心系统部基于Nginx开发的Web服务器,它在Nginx的基础上,针对大访问量网站的需求,添加了很多功能和特性.Tengine的性能和稳定性已经在大型的网站如淘宝网,淘宝商 ...

  9. Cordova5 -- iOS实战（一）

      由于最近公司的项目要求用Cordova来进行开发,便开始了对Cordova的学习.由于本人之前也是做iOS开发,因此相关内容主要从iOS平台的角度来写.刚开始学习Cordova这个平台,希望以此总 ...

  10. App.Config 在windows 服务中的应用问题

    今天使用Windows服务 打包是使用的 Installsheild Limited Edition 2012 制作好后发现 运行安装包的时候 一直报错 后来发现ConfigurationManage ...