Html 如何使用纯CSS自动调整文本区域大小

如何使用纯CSS自动调整文本区域的大小

{{FormDataJSON.comments}
评论

它将为您提供一个支持调整大小的文本区域

div{
边框：2倍实心；
填充：20px；
宽度：300px；
调整大小：两者；
溢出：自动；
}
要调整大小：单击并拖动此div元素的右下角

您不能根据文本内容自动调整大小，但如果您谈论的是根据屏幕大小调整大小，您可以。您正在使用bootstrap，因此可能需要覆盖bootstrap具有的文本区域的css

textarea {
    width: 80%; 
    height: 20%;
}

你想要的宽度和高度的百分比是多少

或者对不同的大小使用媒体规则，例如

@media (max-width: 420px) {
    #Remarks {
        width: 320px;
        height: 80px;
    }
}
@media (max-width: 767px) {
    #Remarks {
        width: 500px;
        height: 100px;
    }
}

---

您想按照什么规则自动调整大小？它的父对象、整个页面、用户视口的大小？我们需要更多的信息。如果你想随着文本的增长自动调整大小，你需要使用javascript。使用CSS是不可能的。因为它必须侦听事件。这可能会有帮助：