要实现textarea文本域的宽度和高度自动适应，可以使用以下两种方法：

方法一：使用CSS属性resize

resize属性可以控制textarea文本域的调整大小功能。默认情况下，该属性值为none，即textarea不能调整大小。将属性值设置为both、horizontal、vertical之一，即可实现相应方向上的自动适应。同时，需要将width和height属性设置为auto。

示例一：

textarea {  resize: both;  width: auto;  height: auto;}

示例二：

textarea {  resize: horizontal;  width: auto;  height: auto;}

方法二：使用JavaScript自动适应

在文本域中输入文本后，JavaScript可以根据文本内容的实际高度和宽度来计算文本域的高度和宽度，并自动调整。具体的实现步骤如下：

1. 禁止用户手动调整textarea尺寸，将resize属性值设为none
2. **textarea的键盘输入事件和paste事件，触发文本变化处理函数
3. 在文本变化处理函数中，根据文本内容计算出实际高度和宽度，并将值设置为textarea的高度和宽度

示例一：

<textarea id="myTextarea" onkeyup="autoResize()"></textarea><script type="text/javascript">function autoResize() {  document.getElementById("myTextarea").style.height = "auto";  document.getElementById("myTextarea").style.width = "auto";  var h = document.getElementById("myTextarea").scrollHeight;  var w = document.getElementById("myTextarea").scrollWidth;  document.getElementById("myTextarea").style.height = h + "px";  document.getElementById("myTextarea").style.width = w + "px";}</script>

示例二：

<textarea id="myTextarea"></textarea><script type="text/javascript">function autoResize() {  document.getElementById("myTextarea").style.height = "auto";  document.getElementById("myTextarea").style.width = "auto";  var h = document.getElementById("myTextarea").scrollHeight;  var w = document.getElementById("myTextarea").scrollWidth;  document.getElementById("myTextarea").style.height = h + "px";  document.getElementById("myTextarea").style.width = w + "px";}document.getElementById("myTextarea").addEventListener("keyup", autoResize);document.getElementById("myTextarea").addEventListener("paste", autoResize);</script>