比如，有这个一个demo页面：
<head> <meta charset="UTF-8"> <meta name="format-detection" content="telephone=no, address=no, email=no, time=no"> <meta name="viewport" content="width=device-width,user-scalable=no,initial-scale=1.0"> <title>Title</title> <style> .text-input{ font-size: 1.2rem; line-height: 1.2rem; height: 1.2rem; border: 1px solid #eee; -webkit-appearance: none; } </style> </head> <body> <h2>input type="text"中输入emoji表情时表情被截掉一部分的bug</h2> <input class="text-input" type="text" name="comment"> </body> </html>当你在手机上(比如iPhone 5S)浏览这个页面，并在页面的输入框中输入一些中文内容的同时再输入几个emoji表情的时候, 会发现emoji表情无法完整显示,看起来就像有一部分被裁切掉了。
问题发现了，处理起来就比较简单了——加大行高, 比如, 加大到1.5rem。这个问题不难, 之所以收录进来，是因为自测的时候,很容易忘记对emoji表情这种特殊的输入进行测试验证，从而最终导致bug的存在。
相关资源：敏捷开发V1.0.pptx