如何在textarea中的行之间绘制分隔符

Question

是否可以仅使用CSS在 textarea 中的行之间绘制分隔符，如下图所示：

注意：我知道如果我通过使用javascript为每个元素创建一个新行来使用表格，这很容易，但我正在探索是否有一个简单的解决方案只使用CSS for textarea

谢谢，

Answer 1

是的，你可以用css线性渐变来实现它。 Demo

CSS

 textarea {
  height: 80px;
  line-height: 22px;
  background: repeating-linear-gradient(
  0,
  #222,
  #222 1px,
  #333 1px,
  #333 20px
);
 color: #fff; 
}

HTML

<textarea name="" id="" cols="30" rows="10"></textarea>