SOURCE

<div>
<label>
  name:<input id='username' autocomplete="off"/>
  <span class='callout'>只能输入字母数字下划线</span>
</label>
</div>

input:not(:focus) + .callout{
  transform:scale(0);
  transition:.25s transform;
}
.callout{
  width:30em;
  display:block;
  text-align:center;
  border:.1em solid #ccc;
  border-radius:0.5em;
  background:orange;
  padding:.5em;
  transform-origin:1.4em -.4em;
  transition:1s cubic-bezier(.1,.25,.3,1.5) transform;
}