gpt4 book ai didi

javascript - 如何为文本区域中的每一行设置底部边框?

转载 作者:太空狗 更新时间:2023-10-29 13:12:22 25 4
gpt4 key购买 nike

我想知道如何添加 border-bottom <textarea> 中每一行的行,但是我只能得到最下面一行的 border-bottom去做这个。

有没有办法做到这一点?

.input-borderless {
width: 80%;
border-top: 0px;
border-bottom: 1px solid green;
border-right: 0px;
border-left: 0px;
background-color: rgb(241,250,247);
text-decoration: none;
outline: none;
display: block;
padding: 10px 0;
margin: 20px 0;
font-size: 1.6em;
}
<textarea rows="3" class="input-borderless" placeholder="Describe the project"></textarea>

最佳答案

您可以使用渐变作为背景图像来获得看起来像下划线的效果:

JSFiddle

textarea
{
line-height: 4ch;
background-image: linear-gradient(transparent, transparent calc(4ch - 1px), #E7EFF8 0px);
background-size: 100% 4ch;
}

关于javascript - 如何为文本区域中的每一行设置底部边框?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/34803476/

25 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com