变相实现textarea文本域
效果图:

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文本域的更多相关文章
- div模拟textarea文本域轻松实现高度自适应
<!doctype html> <html lang="en"> <head> <meta charset="UTF-8&quo ...
- Kindeditor富文本实现textarea文本域的上传及单独button 按钮绑定(用来实现单文件上传)
在最近项目要新增一个内容文章,文章包含一般的正文内容,其中正文中可以包含多张图片.文章最多包含一个音频文件.文章正文的上传功能我是通过textarea文本域绑定kindeditor编辑器实现的,而单独 ...
- div模拟textarea文本域轻松实现高度自适应——张鑫旭
by zhangxinxu from http://www.zhangxinxu.com本文地址:http://www.zhangxinxu.com/wordpress/?p=1362 一.关于tex ...
- textarea文本域的高度随内容的变化而变化
用css控制textarea文本域的高度随内容的变化而变化,不出现滚动条. CSS代码: 复制代码 代码如下: .t_area{ width:300px; overflow-y:visible } & ...
- textarea文本域轻松实现高度自适应
转载:http://www.xuanfengge.com/textarea-on-how-to-achieve-a-high-degree-of-adaptive.html 今天需要些一个回复评论的页 ...
- css之——div模拟textarea文本域的实现
1.问题的出现: <textarea>标签为表单元素,但一般用于多行文本的输入,但是有一个明显的缺点就是不能实现高度自适应,内容过多就回出现滚动条. 为了实现高度自适应:用div标签来代模 ...
- 使用contenteditable+div模拟textarea文本域实现高度自适应
使用contenteditable+div模拟textarea文本域实现高度自适应 开发过程中由于需要在发送消息的时候需要有一个可以高度自适应的文本域,一开始是使用textarea并搭配auto-si ...
- textarea文本域宽度和高度(width、height)自己主动适应变化处理
文章来源:http://www.cnblogs.com/jice/archive/2011/08/07/2130069.html <HTML> <HEAD> <TITLE ...
- HTML学习笔记 域元素(form表单、textarea文本域、fieldset域集合、input使用) 案例 第四节 (原创)
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...
随机推荐
- 【转】python之配置日志的几种方式
[转]python之配置日志的几种方式 作为开发者,我们可以通过以下3种方式来配置logging: 1)使用Python代码显式的创建loggers, handlers和formatters并分别调用 ...
- Linux下自动清理超过指定大小文件
作者:邓聪聪 扫描某个目录下的文件,发现超过指定大小即清空 1)扫描目录下的文件 2)判断文件大小 3)清空大于指定文件的内容 以byte为单位显示文件大小,然后和20M大小做对比. 20M换算成字节 ...
- FTP服务器基础设定
1.安装vsftpd文件服务器 sudo apt-get install vsftpd 2.配置文件:/etc/vsftpd/vsftpd.conf 严格来说,整个 vsftpd 的配置文件就只有这个 ...
- hibernate框架学习第六天:QBC、分页查询、投影、数据加载策略、二级缓存
QBC查询 1.简单查询 Criteria c = s.createCriteria(TeacherModel.class); 2.获取查询结果 多条:list 单挑:uniqueResult 3.分 ...
- $Django 图片验证刷新 上传头像
1.图片验证刷新 $('img').click(function () { $('img')[0].src+='?' }) 2.上传头像 1.模板 <div class="form-g ...
- nginx https配置记录
一.证书生成: 要有两个文件,一个私钥,一个证书. 私钥:-----BEGIN PRIVATE KEY----- 开始 证书:-----BEGIN CERTIFICATE----- 开始 二.Ngin ...
- 1-HTML Attributes
下表列举了常用的Html属性 Attribute Description alt Specifies an alternative text for an image, when the image ...
- UVA 1395 MST
给你一个图, 求一个生成树, 边权Max – Min 要最小,输出最小值, 不能构成生成树的 输出 -1: 思路: Keuksal 算法, 先排序边, 然后枚举 第一条边, 往后加入边, 直到有 n- ...
- HDU 1074 (DP + 状态压缩)
题意: 给你N个课程, 每个课程有结束的时间 , 和完成这门课程需要的时间 超过课程结束ed时间,每一天就要花费 1点绩点: 然后要求你安排如何做课程使得花费的绩点最少 (看了博客后才发现状态压缩很⑥ ...
- 前端----css 选择器
css 为了修饰页面作用, 让页面好看 ⑴ css的引入方式1,行内样式body里面2,内接样式在html里面的 style 里面3,外接样式两种:①链接式: <link rel=" ...