效果图:

html:

            <div>
<form action="">
<div class="ta-div" contenteditable="true"><br /></div>
<input type="button" value="发布" class="mtb60 btn btn-lg cf bgc-52c4d5 pct40">
</form>
</div>

css:

            .ta-div{
width: 100%;
min-height: 200px;
max-height: 400px;
height: 200px;
border: 1px solid #8b8b8b;
word-wrap: break-word;
overflow-y: auto;
}
.bgc-52c4d5 {
background-color: #52c4d5;
}
.cf {
color: #fff;
}
.mtb60 {
margin-top: 60px;
margin-bottom: 60px;
}
.pct40 {
width: 40%;
}
.btn-lg {
padding: 10px 16px;
font-size: 18px;
line-height: 1.3333333;
border-radius: 6px;
}
.btn {
display: inline-block;
font-weight:;
text-align: center;
white-space: nowrap;
vertical-align: middle;
touch-action: manipulation;
cursor: pointer;
-webkit-user-select: none;
user-select: none;
background-image: none;
border: 1px solid transparent;
}

变相实现textarea文本域的更多相关文章

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

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

  2. Kindeditor富文本实现textarea文本域的上传及单独button 按钮绑定(用来实现单文件上传)

    在最近项目要新增一个内容文章,文章包含一般的正文内容,其中正文中可以包含多张图片.文章最多包含一个音频文件.文章正文的上传功能我是通过textarea文本域绑定kindeditor编辑器实现的,而单独 ...

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

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

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

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

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

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

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

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

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

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

  8. textarea文本域宽度和高度(width、height)自己主动适应变化处理

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

  9. HTML学习笔记 域元素(form表单、textarea文本域、fieldset域集合、input使用) 案例 第四节 (原创)

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

随机推荐

  1. C++拷贝构造函数(深拷贝&浅拷贝)

    对于普通类型的对象来说,它们之间的复制是很简单的,例如: int a=88; int b=a; 而类对象与普通对象不同,类对象内部结构一般较为复杂,存在各种成员变量.下面看一个类对象拷贝的简单例子. ...

  2. [Kubernetes]CentOS7下Etcd集群搭建

    Etcd简要介绍 Etcd是Kubernetes集群中的一个十分重要的组件,用于保存集群所有的网络配置和对象的状态信息 Etcd构建自身高可用集群主要有三种形式: ①静态发现: 预先已知 Etcd 集 ...

  3. 【转】实习小记-python 内置函数__eq__函数引发的探索

    [转]实习小记-python 内置函数__eq__函数引发的探索 乱写__eq__会发生啥?请看代码.. >>> class A: ... def __eq__(self, othe ...

  4. 10 个 MySQL 经典错误【转】

    Top 1:Too many connections(连接数过多,导致连接不上数据库,业务无法正常进行) 问题还原 mysql> show variables like '%max_connec ...

  5. longzhuapp项目笔记

    1.配置不同环境的打包命令

  6. boost 文件系统

    第 9 章 文件系统 目录 9.1 概述 9.2 路径 9.3 文件与目录 9.4 文件流 9.5 练习  该书采用 Creative Commons License 授权 9.1. 概述 库 Boo ...

  7. tomcat session Memcache 共享

    背景 这次做的这个项目并发还真是挺高,单表一天产生百万条记录不在话下.结果导致运行过程中经常丢失数据,卡.慢等.开来终于要搞一次负载均衡了,之前实验学习了不少,但是没有在项目中实际用过,因为并发量不大 ...

  8. Chromium Embedded Framework (CEF)_3.2171.2069_v20170606_x86.tar.xz

    CEF 为观看各个直播平台而特此修改的浏览器 可以单独提取 Flash 视频, 并可以修改视频的大小等功能 [增加了960x90% 和 1280x90%] 这次修改是主要针对 YY web 直播平台 ...

  9. mysql查询sending data占用大量时间的问题处理

    问题描述:某条sql语句在测试环境执行只需要1秒不到,到了生产环境执行需要8秒以上 在phpmyadmin里面执行性能分析,发现sending data占用了差不多90%以上的时间 查询一下“Send ...

  10. 虚拟机静态ip设置

    1.安装之后,用ifconfig命令发现没有ip信息,如下图,发现没有ip信息(好坑). 网上找了各种资料,最后才发现实自己的网卡没有启动,虽然使用service restart network,但是 ...