文本框技巧总结

1.input高度固定，自动增宽
<input  type="text"  style="width:60;overflow-x:visible;overflow-y:visible;">

2.textarea宽度固定，自动增高
<textarea  type="text"  style="width:260;overflow-x:visible;overflow-y:visible;"></textarea>
3.input宽度固定，自动增高
  <textarea style="overflow-y:visible"></textarea>
4.增加文本框行数
<textarea name="textarea1" cols="26" rows="1"></textarea>
<br/>
<input type="button" οnclick="with(document.form1.textarea1)rows=rows>1?rows-1:1;" value="减少行数"/>
<input type="button" οnclick="document.form1.textarea1.rows=5;" value="还原"/>
<input type="button" οnclick="document.form1.textarea1.rows+=1;" value="增加行数"/>
5.网页放大缩小功能
<script type="text/JavaScript">var i=1;</script>
<input type="button" οnclick="i>0.6?i-=0.2:i=0.4;document.body.style.zoom=i;" value="缩小"/>
<input type="button" οnclick="i=1;document.body.style.zoom=i;" value="还原"/>
<input type="button" οnclick="i+=0.2;document.body.style.zoom=i;" value="放大"/>
6.文本框css样式以及js控制
.textarea13{
          overflow-y:visible;
    background-color:#FFFFCC;
       border-left:1px solid #7F9DB9;
    border-right:1px solid #7F9DB9;
    border-top:1px solid #7F9DB9;
    border-bottom:1px solid #7F9DB9;
  }
<script language="JavaScript">

        function setRows() {
          var textarea = document.getElementById("content");
          var cols = textarea.cols;
          var str = textarea.value;
          str = str.replace(//r/n?/, "/n");
          var lines = 1;
          var chars = 0;
          for (i = 0; i < str.length; i++) {
            var c = str.charAt(i);
            chars++;
            if (c == "/n" || chars == cols) {
              lines=2;
     document.getElementById("content").style.overflowY = "auto";
              chars = 0;
            }
          }
           if(str.length==0)
    {
     document.getElementById("content").style.overflowY = "visible";
    }
          textarea.setAttribute("rows", lines);
          //textarea.style.height = lines*12 + "px";
        }

      </script>

<textarea id="content" οnkeyup="setRows();" rows="1" name="USERID" cols="40" class="textarea13"></textarea>