Question

我不知道该怎么做。我现在正在使用Bootstrap的textarea及其容器。我不知道如何制作它以便textarea延伸到屏幕的底部，根据窗口高度自动增加/减少。我试过了：

#form-control {
    position:fixed;
    top:0;
    left:0;
    right:0;
    bottom:0;
}

但似乎没有任何改变。有谁知道我怎么做到这一点？

编辑：

这是我的html文件：

<body>
    <div class="container">
        <div class="form-group">
            <textarea class="form-control" rows="15" id="note"></textarea>
        </div>
    </div>
</body>

Answer 1

您必须在元素上添加height属性，如下面的代码。

#form-control {
    position:fixed;
    top:0;
    left:0;
    right:0;
    bottom:0;
    height:50px;
}

如果不起作用，请尝试！important。如果它也不起作用，请尝试在标记中设置行并在CSS上设置行高。

<textarea rows="4">

Answer 2

.form-control应该是bootstrap的CSS类。

您使用的是<textarea class="form-control"></textarea>吗？如果是，则您的css规则使用#，它对应于元素ID，而不是类。将您的CSS更改为：

.form-control {
    position:fixed;
    top:0;
    left:0;
    right:0;
    bottom:0;
}

Answer 3

试试这段代码。实际上你已经使用了（id）#form-control，它应该是（class）.form-control 我已经使用了你的代码，只是增加了100％的宽度现在它取得了屏幕的高度和宽度。

＆＃13;

.form-control {
    position:fixed;
    top:0;
    left:0;
    right:0;
    bottom:0;
    width:100%
}

＆＃13;

<div class="form-group">
  <textarea class="form-control" placeholder="textarea"></textarea>
</div>

＆＃13;

Answer 4

您可以使用height属性将其设置为特定高度。

您可以这样做：

#form-control {
position:fixed;
height: 200px;
}

或

#form-control {
position:fixed;
height: 50%;
}

就像一些例子。

我建议您在高度css属性上查看this W3 Schools页面...如果您阅读该页面，您可以看到您还可以调整其大小。

在该页面上还有this演示的链接，我建议您尝试查看不同的＆＃34;设置＆＃34;因为缺乏更好的词。

同时确保开头<textarea>标记调用selector ...所以它应该看起来像这样<textarea id="form-control">。

祝你好运

Textarea总是有窗户高度

4 个答案: