<textarea>水平ルール付き

Question

背景画像を使用せずに<textarea>内に水平ルールを作成する方法を知っている人はいますか？

CSS3は問題ありません。私は必要に応じてIE用のイメージフォールバックを行うことができます。

例：

Answer 1

あなたはこの線形グラデーションを使用して行うことができます。

.notes { 
 
    background-attachment: local; 
 
    background-image: 
 
     linear-gradient(to right, white 10px, transparent 10px), 
 
     linear-gradient(to left, white 10px, transparent 10px), 
 
     repeating-linear-gradient(white, white 30px, #ccc 30px, #ccc 31px, white 31px); 
 
    line-height: 31px; 
 
    padding: 8px 10px; 
 
}

<textarea class="notes"></textarea>

JSFiddle Version

Answer 2

私は画像を使用することが適切なソリューションだと思います。

フォールバック：テキストエリアの透明な背景、ラッパーの背景画像DIV。