也许有人可以帮助我解决这个问题:我正在寻找一种无 javascript 的解决方案来显示文本区域中的行。这里接受的答案对我不起作用,因为它取决于框内的固定行高。
我的文本区域如下所示:
textarea{
line-height: 2em;
}
所以仅图像解决方案不起作用。有什么东西,也许是与 CSS3 相关的,可以存档吗?我试过了
background: url('whitepx.png') repeat left 2em #363636;
但这会将整个 textarea 着色为白色。
更新
我想我明白了。抱歉,如果我的问题不够清楚。
这是我最后的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;
}
看到这个小提琴。在我看来已经足够好了。