基于此开发文档:https://developer.mozilla.org/zh-CN/docs/Web/Guide/HTML/Content_Editable

问题:通过contenteditable实现的输入框没有placeholder,所以自己实现了一下

.cd-write{background:#fafafa;padding:8px 12px;position:fixed;left:;right:;bottom:;border-top:solid 1px #dfdede;z-index:;}
.cd-write .btn{background:#fda626;color:white;height:34px;font-size:16px;width:60px;text-align:center;border-radius:5px;line-height:34px;position:fixed;bottom:11px;right:12px;}
.cd-write .input{overflow:hidden;padding:8px 6px;border:solid 1px #ebebeb;overflow:auto;background:white;border-radius:5px;min-height:16px;max-height:100px;line-height:140%;outline:none;margin-right:70px;}
.cd-write .input:empty:before{content: attr(placeholder);color:#bbb;}
<div class="cd-write">
<div class="btn">发送</div>
<div class="input" contentEditable="true" placeholder="评论"></div>
</div>

HTML5 Content Editable实践的更多相关文章

  1. HTML5 history API实践

    一.history API知识点总结 在HTML4中,我们已经可以使用window.history对象来控制历史记录的跳转,可以使用的方法包括: history.forward();//在历史记录中前 ...

  2. 【转】39个让你受益的HTML5教程

    闲话少说,本文作者为大家收集了网上学习HTML5的资源,期望它们可以帮助大家更好地学习HTML5. 好人啊! 不过,作者原来说的40个只有39个,因为第5个和第8个是重复的. 原文在此! 1. 五分钟 ...

  3. 39个让你受益的HTML5教程

    1. 五分钟入门HTML5 (Learn HTML5 in 5 Minutes!) By Jennifer Marsman 毫无疑问,HTML5是一个热门话题.如果你需要一个迅速了解HTML基础的速成 ...

  4. 【HTML5 1】39个让你受益的HTML5教程

    闲话少说,本文作者为大家收集了网上学习HTML5的资源,期望它们能够帮助大家更好地学习HTML5. 好人啊! 只是,作者原来说的40个仅仅有39个,由于第5个和第8个是反复的. 原文在此! 1. 五分 ...

  5. 39一个可以让你受益HTML5课程

    事不宜迟,本文作者是我们收集的在线学习HTML5资源.我们希望他们能够帮助你更好地学习HTML5. 不错啊! 只,说原作者40一个只有39一.由于第一5钍和8一是重复. 原文在此! 1. 五分钟入门H ...

  6. 【转帖】39个让你受益的HTML5教程

    39个让你受益的HTML5教程                    闲话少说,本文作者为大家收集了网上学习HTML5的资源,期望它们可以帮助大家更好地学习HTML5. 好人啊! 不过,作者原来说的4 ...

  7. BAT大佬推荐使用的HTML5的十个功能

    HTML5不是新事物.自从最初发布(2008年1月)以来,我们一直在使用它的一些功能.后来,我再次仔细查看了HTML5功能列表.看到我发现了什么?到目前为止,我还没有真正使用过它! 在本文中,我列出了 ...

  8. 15 Best Responsive HTML5 Frameworks 2014

    Best HTML5 frameworks are most popular because with the use of these frameworks you can create websi ...

  9. 开销是有益的:AppCan 至HTML5移动创新和创业精神和健康

      2014年移动创业更趋向理性,消费级App市场接近饱和,BAT等巨头的竞争更加激烈,市场版图及格局基本定型.而企业级移动应用却迎来爆发增长,替代进入红海的消费级App市场,企业级定制APP开发成为 ...

随机推荐

  1. WPF自定义控件与样式(9)-树控件TreeView与菜单Menu-ContextMenu

    一.前言 申明:WPF自定义控件与样式是一个系列文章,前后是有些关联的,但大多是按照由简到繁的顺序逐步发布的等,若有不明白的地方可以参考本系列前面的文章,文末附有部分文章链接. 本文主要内容: 菜单M ...

  2. Netbeans不能正常启动glassfish或者部署失败不能运行的问题

    错误信息:D:\临时文件\netbeans\WebTest\build\web中部署GlassFish Server 4, deploy, Connection refused: connect, f ...

  3. exp/imp 参数说明,中英对照

    在任意可用exp/imp(导出/导入)命令的主机上,都可以通过exp/imp help=y查看所有的参数说明. 1.exp参数说明 2.imp参数说明 3.exp参数说明(中文) 4.imp参数说明( ...

  4. Nodejs学习笔记(一)——初识Nodejs

    前言:目前工作的分内之事相对较为单一,希望可以通过工作之余的时间给自己充充电,只是没有一个学伴或大神带,只能说是摸索着前进.起初准备好好研究下Spring这个框架,下载了源码,结合书籍准备一探究竟,看 ...

  5. C语言中两位ASCII码可以表示汉字

    最近偶然有人问到这个相关字符编码的问题,所以百度了下参考了这两个资料,进行了简单分析. ******************************************************** ...

  6. 把图片加载到BufferedImage中

    把图片加载到BufferedImage 中有什么作用呢?它就可以利用 ImageIO.write(image, "JPEG", response.getOutputStream() ...

  7. 第3/24周 区_SQL Server中管理空间的基本单位

    哇哦,SQL Server性能调优培训已经进入第3周了!同时你已经对SQL Server内核运行机制有了很好的认识.今天我会讲下SQL Server中的区管理,因为这是个很重要的话题,我们会在第23周 ...

  8. 常用的winform属性和工具箱工具

    WinForm: 客户端程序制作 - C/S B/S(外部端,网页端) 不是必须在windows系统上才能运行是在.NET Framework框架上运行  ,在苹果系统上有框架照样可以运行 常用窗体属 ...

  9. The system cannot find the file specified

    在家工作,程序在家里的电脑运行时,出现一个异常,还是第一见到: Server Error in '/' Application. The system cannot find the file spe ...

  10. 介绍开源的.net通信框架NetworkComms框架 源码分析(九) IPConnection

    原文网址: http://www.cnblogs.com/csdev Networkcomms 是一款C# 语言编写的TCP/UDP通信框架  作者是英国人  以前是收费的 目前作者已经开源  许可是 ...