4

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

基本上,如果有人在 a 中键入一堆带有换行符的文本textarea,然后将此数据提交存储在 MySQL 中,我想使用white-spaceCSS 属性在 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>
4

3 回答 3

4
textarea{white-space:pre}

当我看到这个时,这是因为您的 textarea 正在从某些东西继承一个 white-space:nowrap 。它也可以通过 textareas 上的 wrap="no" 来复杂化,这有时会很有用。

textarea nowrap 的默认行为是 pre,因此只需在样式底部设置上述 CSS 即可覆盖设置空白的任何位置。

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

于 2014-04-19T17:46:36.897 回答
1

不。

<textarea>元素已经从字面上处理了空格。没有必要尝试将事情掌握在自己手中。

于 2013-04-15T23:36:12.080 回答
0

事情对我来说似乎一切正常......把它扔进一个codepen只是为了测试它。直接添加时,换行符在文本区域内看起来很好。

不知道怎么回事。PHP是否剥离换行符?您是否在通过 $profile['bio'] 传递的任何内容周围使用双引号?

这是一个可能对您有所帮助的答案:textarea 的 .val() 不考虑换行

尤其是最后一个回应。根据您的代码,听起来 .replace() 方法不是您所需要的(但我可能是错的......也许我不明白您在做什么)。

于 2015-09-16T03:32:06.103 回答