input,textarea的区别

在HTML中有两种方式表达文本框,一个是用input标签的单行文本框,一种是textarea标签多行文本框。那我们来看看他们的区别:

input标签

1、需要指定type属性,如text,password等。

2、通过size属性指定显示字符的长度。

3、value属性指定初始值

4、Maxlength属性指定文本框可以输入的最长长度。

5、焦点垂直居中文本框中,单行

textarea标签

1、需要</textarea>来封闭标签

2、内容写在标签对中

3、使用row、col指定textarea大小

4、焦点在左上角,多行


然后就是最近听到一个问题:

怎么用div来模拟实现一个textarea?

关键:我们要知道一个h5的属性,那就是contenteditable,将属性设置成true就会使得div是可以编辑的。

如果将body设置这样的属性,你就会发现该属性多么神奇。

有的小伙伴会问,这是h5的属性,那他的兼容性如何呢?

这个属性兼容IE6之后的版本,很强大

直接上代码:


div模拟textarea

作者:孙以哲

最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

推荐阅读更多精彩内容

  • 问答题47 /72 常见浏览器兼容性问题与解决方案? 参考答案 (1)浏览器兼容问题一:不同浏览器的标签默认的外补...
    _Yfling阅读 13,862评论 1 92
  • HTML标签解释大全 一、HTML标记 标签:!DOCTYPE 说明:指定了 HTML 文档遵循的文档类型定义(D...
    米塔塔阅读 3,406评论 1 41
  • 作为前端和后台最基础可靠的神器工具JQuery,你真的对她有足够了解么? 亚非拉地区苦逼的前端er们,有时候不得不...
    扭了个妞阅读 388评论 0 0
  • 转载请声明 原文链接地址 关注公众号获取更多资讯 第一部分 HTML 第一章 职业规划和前景 职业方向规划定位...
    前端进阶之旅阅读 16,674评论 32 459
  • 每当过年,那些七大姑八大姑争着抢着给你介绍对象,这个介绍不成,换一个,还不成,弄的大家都尴尬,伤了面子又闹不开心。...
    星橪阅读 148评论 0 0