用DIV+CSS模拟textarea，实现文本框高度自适应用户输入的文本

最新推荐文章于 2024-06-07 10:24:08 发布

孙小兔

最新推荐文章于 2024-06-07 10:24:08 发布

阅读量1.7k

点赞数

分类专栏： JavaScript

本文链接：https://blog.csdn.net/sxl0727tu/article/details/22745531

版权

JavaScript 专栏收录该内容

4 篇文章 0 订阅

订阅专栏

效果图：

关键代码：

<div contenteditable="true"> </div>

contentEditable：　

是html中的一个属性。设置html的contentEditable=‘true’时，即可开启该元素的编辑模式

代码如下：

<%@ page language="java" import="java.util.*" pageEncoding="utf-8"%>
<%
String path = request.getContextPath();
String basePath = request.getScheme()+"://"+request.getServerName()+":"+request.getServerPort()+path+"/";
%>

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<style type="text/css">
  .test_box {
    width: 400px; 
    min-height: 120px; 
    max-height: 500px;
    border:1px solid #000 <!-- 设置对象边框宽度为1px黑色实现边框 -->
}
</style>
  <body>
    <div class="test_box" contenteditable="true"><br /></div>
    <p>
    <div class="test_box" contenteditable="true"><br /></div>
  </body>
</html>

确定要放弃本次机会？

福利倒计时

: :

立减 ¥

普通VIP年卡可用

立即使用

孙小兔

关注关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
用DIV+CSS模拟textarea，实现文本框高度自适应用户输入的文本

效果图：关键代码： contentEditable：　是html中的一个属性。设置html的contentEditable=‘true’时，即可开启该元素的编辑模式代码如下：<%String
复制链接

扫一扫