Question

我想在移动视图中减少textarea中的列数，我该怎么做？这是我的HTML（基于引导程序）：

＆＃13;

<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script>
<link href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" rel="stylesheet"/>
 <div class="row">
     <div class="col-xs-6 col-sm-6 col-md-2">
          <textarea name="content" rows="4" cols="80" id="content"></textarea>
     </div>
 </div>

＆＃13;

在移动视图中，我需要侧向滚动屏幕以显示所有texterea，所以我想减少列数。

Answer 1

您可以在textarea上使用类form-control，然后通过设置其父级的宽度来控制其宽度。 form-control基本上试图覆盖其父级的全宽。因此，当您将父类的类设置为col-xs-10时，textarea将相应地受到约束。

如果您的屏幕宽度减小，textarea将自动调整大小。

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script>
<link href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" rel="stylesheet"/>
 <div class="row">
     <div class="col-xs-10">
          <textarea class="form-control" name="content" rows="4" id="content"></textarea>
     </div>
 </div>

＆＃13;

Answer 2

我删除了attr cols =＆＃34; 80＆＃34;它受到了引导类的影响。

减少移动视图中textarea中的列数

2 个答案: