Html 如何以相对行高显示文本区域中的行？

也许有人可以帮我解决这个问题：我正在寻找一个无javascript的解决方案来显示文本区域中的行。这个选项对我不起作用，因为它取决于框内的固定线高度。 我的文本区域如下所示：

textarea{
  line-height: 2em;
}

因此，仅图像解决方案不起作用。有什么东西，可能是CSS3相关的，可以存档吗？ 我试过了

background: url('whitepx.png') repeat left 2em #363636;

但这会将整个文本区域涂成白色

更新

我想我明白了。对不起，如果我不能把我的问题说清楚

这是我的css：

textarea
    {
    width: 100%;
    background-color: #363636;
    border: 1px solid #fff;
    outline: none;
    color: #fff;
    font-size: 14px;
    display: block;
    padding: 0 0 0 1em;
    line-height: 2em;
    font-family: sans-serif;
    resize: none;
    height: 58em;
    width: 530px;
    background-image: -moz-repeating-linear-gradient(#363636, #363636 20%, #fff 22%);
    background-image: -webkit-repeating-linear-gradient(#363636, #363636 20%, #fff 22%);
    background-image: -o-repeating-linear-gradient(#363636, #363636 20%, #fff 22%);
    background-image: -ms-repeating-linear-gradient(#363636, #363636 20%, #fff 22%);
    background-image: repeating-linear-gradient(#363636, #363636 20%, #fff 22%);    
    background-size: 100% 2em;
    background-attachment: local;
}

---

看这个。对我来说已经足够好了。

你可以用这种方法来完成

尝试使用多个线框阴影

---

检查>

您所说的显示线是什么意思？你的意思是突出显示文本区域中的一行？也许可以做一把小提琴？我的意思是在文本区域中显示类似记事本的行，就像在链接问题的图片中一样。那么使用图像有什么问题吗？问题是我无法创建2米高的图像。如果我没有准确描述我的问题，很抱歉，但那不是我想要的。请参阅我更新的问题，以获得似乎有效的解决方案。