如何使用引导行和列增加textarea的高度

Question

我设计了一种表格，其中连续有两个项目，如下所示：

我的输出

我使用的代码：

<div class="row">
    <div class="col-sm-3">  <!-- [1, 0] -->
        <fieldset class="form-group">
            <label id="fieldTitle">Equipment Length</label>
            <select id="selectOption" class="form-control" required data-error="Please select Equipment Length"></select>
            <div class="help-block with-errors"></div>
        </fieldset>
    </div>
    <div class="col-sm-9">  <!-- [1, 1] -->
        <fieldset class="form-group">
            <label id="fieldTitle">Customer Notes</label>
            <textarea class="form-control" placeholder="Please write customer notes" ng-model="myTextarea" required data-error="Please enter customer notes"></textarea>
            <div class="help-block with-errors"> {{myTextarea}} </div>
        </fieldset>
    </div>
</div>

所以，请像我一样指导我如何增加文本区域的高度

期望的输出 请告诉我我该怎么做。谢谢

Answer 1

使用 Bootstrap 4，您需要添加 h-25 类

<textarea class="form-control h-25" rows="5" placeholder="Please write customer notes"></textarea>

Answer 2

在HTML集中

<textarea rows="10"></textarea>

在CSS集中

textarea { height: 100px; }

希望对您有所帮助。

Answer 3

类表单控件删除 textarea 行属性，因此只需将其替换为col-md-12

<textarea class="col-md-12" placeholder="Please write customer notes" ng-model="myTextarea" required data-error="Please enter customer notes"></textarea>

Answer 4

textarea {
  width: 300px;
  height: 150px;
}

根据需要进行调整。

Answer 5

使用Bootstrap 4，您将需要具有属性行并添加“ height：100％;”。这样高度可以延伸到指定的行数。“行”不起作用。

<textarea rows="10" style="height:100%;"></textarea>