How can I underline all rows in textarea?

前端 未结 4 1850
北海茫月
北海茫月 2021-01-03 16:52

How can I underline all rows in textarea?

I need in something like this.

P.S. Textarea has style padding: 10px

I can\'t you background,

4条回答
  •  天命终不由人
    2021-01-03 17:17

    Universal solution

    1. Create two divs with the same styling.
    2. First div is a "mirror" div with color: transparent; position: absolute.
    3. Second div is contenteditable="true", with injected span elements.
    4. Add any border-bottom and padding-bottom

    Live Demo

    CodeSandbox editor (using Vue, but easy to port to anything else)

    Note: Please be careful with contenteditable and make sure you secured it from XSS attacks.

提交回复
热议问题