如何将textarea标签放在div标签内？

Question

如何将textarea标签放在div标签内？

htmltags

3

我想在我的网页上添加一个文本框，但它必须放在 div 标签内以保持布局。我不希望用户能够调整文本框的大小，直到它超出我放置它的 div 标记，因为这会破坏整个布局。有没有一种方法可以设置文本框的最大尺寸？

谢谢帮助！

- johan

2个回答

1

最简单的方法（虽然有点粗糙）是在行内样式中设置文本区域。如果您定义了宽度并将resize:none，您的用户将无法调整文本区域的大小并破坏您的设计。

<div>
  <textarea name="yourtextarea" style="width:300px;height:200px;resize:none;" /></textarea>
</div>

我建议您像Xander所回答的那样对文本区域进行样式设置，因为这样会更加清晰。不过我会改变一件事情，就是添加一个不太通用的选择器。

<head> // place in your header
  <style type="text/css">
    #textAreaId {
      width:300px;
      height:200px;
      resize:none;
    }
  </style>
</head>


<body> // place inside of your div, within the body tag

  <div>
    <textarea id="textAreaId" name="yourtextarea" /></textarea>
  </div>

<body>

- VictorKilo

2

有趣的是，当 OP 没有指定需要高度时，您采用了我的 height 声明，并在 HTML 中将其内联添加。为什么不直接给我点赞呢？！ - Alex

1

@Xander Bro，我几乎在同一时间回答了。像你一样，我进一步推断他可能正在寻找固定大小，而不仅仅是宽度。在发布之前我没有看到你的答案，我相信我们都可以同意这些答案并不是突破性的... - VictorKilo

1

@Victorkilo 嘿，"resize:none;" CSS正是我需要的，可以防止用户拖动文本区域！谢谢你。 - johan

@Xander，我没有删除我的答案的唯一原因是它直接向他展示了如何在div中放置文本区域。 - VictorKilo

@VictorKilo 这不正确。结束的 div 标签在哪里？ - Alex

@Xander，我实际上是在你发表评论时才添加了那个内容。并且为了记录，我赞同了你的答案。 - VictorKilo

网页内容由stack overflow 提供, 点击上面的

可以查看英文原文，
原文链接

- Alex · Accepted Answer

CSS:

textarea {
    width:400px;
    height:200px;
    resize:none; /* disable resize functionality */
}