textarea的css white-space属性?

时间:2013-04-15 23:31:24

标签: css textarea

我想在HTML white-space中使用textarea CSS属性。

基本上如果有人在textarea中键入一串带换行符的文本,然后提交此数据以存储在MySQL中,我想使用white-space CSS属性来显示这些换行符在textarea。但是当我尝试它时,它不起作用,只是在一个大段落中显示文本,没有任何中断或任何东西。有没有办法做到这一点?

<form action="includes/changebio.php" method="post" id="form1">         
 <textarea id="bio" style="width: 440px; 
    margin-top:3px;
    text-align:left;
    margin-left:-2px;
    height: 120px;
    resize: none; 
  outline:none;
  overflow:scroll;

  **white-space:pre-line;**

    border: #ccc 1px solid;" textarea name="bio" data-id="bio" maxlength="710" placeholder="<?php echo stripslashes($profile['bio']); ?>"></textarea>
<input type="image" src="assets/img/icons/save-edit.png"class="bio-submit" name="submit" value="submit" id="submit"/>
</form>

3 个答案:

答案 0 :(得分:4)

textarea{white-space:pre}

当我看到这个时,它是因为你的textarea继承了一个白色空间:nowrap from something。它还可以通过wrap =&#34; no&#34;在textareas,有时可能是有用的。

textarea nowrap的默认行为是pre,因此只需在样式底部设置如上所述的css将覆盖设置空白区域的任何位置。

如果你检查你的textarea元素,你肯定会发现层次结构中的某个地方你在某个类型的某个元素上设置了nowrap属性,该元素覆盖了默认的textarea行为。

答案 1 :(得分:1)

别。

<textarea>元素已逐字处理空格。没有必要尝试把事情掌握在自己手中。

答案 2 :(得分:0)

事情似乎对我有用......把它扔进一个codepen只是为了测试它。直接添加时,换行符在textarea中显示正常。

不知道发生了什么事。 PHP剥离换行符吗?你在通过$ profile ['bio']传递的任何内容中使用双引号吗?

以下是可能对您有帮助的答案:The .val() of a textarea doesn't take new lines into account

特别是最后的回应。基于你的代码,它听起来并不像.replace()方法是你需要的(但我可能是错的......也许我不理解你在做什么)。