textarea 不调整大小或收听 CSS答案

【问题标题】：textarea not resizing or listening to CSStextarea 不调整大小或收听 CSS
【发布时间】：2020-06-22 22:28:08
【问题描述】：

我正在尝试在 HTML 中创建一个自定义大小的文本区域，但它似乎不起作用。我将它设置在一个类中，这样我就可以为其设置 CSS 元素，但它似乎不起作用。

.textareas {
  width: 100%;
  height: 150px;
  padding: 12px 20px;
  box-sizing: border-box;
  border: 2px solid #ccc;
  border-radius: 4px;
  background-color: #f8f8f8;
  font-size: 16px;
  resize: none;
}

&lt;div class="textareas"&gt;&lt;textarea&gt;&lt;/textarea&gt;&lt;/div&gt;

它似乎创建了我制作的框，但实际的 textarea 保持不变，仍然很小并且卡在默认值中。

【问题讨论】：

你的 div 有类，而不是 textarea。试试<div><textarea class="textareas"></textarea></div>

标签： html css textarea

【解决方案1】：

检查下面的代码

.textareas {
  width: 100%;
  height: 150px;
  padding: 12px 20px;
  box-sizing: border-box;
  border: 2px solid #ccc;
  border-radius: 4px;
  background-color: #f8f8f8;
  font-size: 16px;
  resize: none;
}

&lt;div&gt;&lt;textarea  class="textareas"&gt;&lt;/textarea&gt;&lt;/div&gt;

【讨论】：

【解决方案2】：

在查看了一些其他示例后，我能够解决此问题。我完全删除了该类并为 textarea 提供了一个 ID，以便可以在 CSS 中调用它

HTML:
<textarea id="text"></textarea>

CSS:
textarea#text{
  width: 100%;
  height: 150px;
  padding: 12px 20px;
  box-sizing: border-box;
  border: 2px solid #ccc;
  border-radius: 4px;
  background-color: #f8f8f8;
  font-size: 16px;
  resize: none;
}

【讨论】：