当前位置：文档之家 › 网页中换行符的处理

网页中换行符的处理

  • 格式：docx
  • 大小：22.13 KB
  • 文档页数：4

网页中换行符的处理
Liu_Rong_Hai@wenku.baidu.com

是HTML标签，表示“换行”的意思。在文本中插入该标签后，网页上
表现为文本换行。

也是HTML标签，表示“段落”的意思。是段落标记符，在网页表现为
一个段落。


是HTML标签，但即将被取消。
问题的提出：
1、简单文本的问题：我们采用表单项（多行文本框）收集用户提
交的留言信息，因此，该信息中可能包含换行符、制表符以及空格，有时可能会
出现连续多个换行符或者空格，如何处理这些字符？

有时我们将换行符用
标签替换。但是按照用户的意思，输入回车的意思
是“换行”还是“另起一段”呢？我们认为即是换行又是另起一段。因此，应该
用标签对进行转换。

2、WORD文档的问题：在发布信息时，经常把WORD文档内容复制到在线
编辑器中，然后发布到网页上。WORD文档中有时会带有“硬回车”或者“软回
车”符。在WORD中，“软回车”叫做“手动换行符”，按Shift+Enter插入；“硬
回车”叫做“段落标记”，按Enter键插入。将WORD文档另存为HTML网页时，
硬回车将转换成段落标记对以及换行编码0x0D 0x0A，软回车将转换成文
本换行符
以及换行编码0x0D 0x0A。

一般来说，在线编辑器会正确处理WORD的格式信息。即把硬回车转换为
段落，将软回车转换为换行
。

问题是：如果网页中不使用
标签，又想保留排版格式，怎么办？
HTML 中的“空白符”包括空格 (space)、制表符 (tab)、换行符 (CR/LF) 三
种。在默认情况下，HTML 源码中的空白符均被显示为空格（包括换行符），并
且连续的多个空白符会被视为一个，连续的多个空白符会被合并。在同一个段落
中，如果文本长度超过了容器的宽度，那么就会产生“自动换行”的现象，多出
来的内容在下一行里继续排列。
网页中的“自动换行”是什么意思呢？它是指某元素内部的文本流按照文本
方向排版，当文本流遇到限制其继续延伸的边界时，是否换行。“不允许自动换
行”则意味着文本流会溢出该元素。

有些时候，我们希望 HTML 源码中的多个连续空格在网页浏览器中可以真
实地呈现，或者需要源码中的换行符能起到真正的换行作用。于是，我们使用 

 标签，它可以真实还原它内部文本的空白符的真实情况。在浏览器里，
 
标签中的文本会表现出自身的空格缩进和换行效果，而不需要我们增加额外的样
式和标签来控制缩进和换行。换言之，
标签不允许“自动换行”。 
因为不允许自动换行，所以
样式并不总能满足我们的期望。比如，在
某些不需要特别严谨的场合，或者排版某些对换行不敏感的代码片断（比如 
HTML 或 CSS）的时候，我们不希望代码片段中的一行长代码令它的容器元素产
生水平滚动条，因为那样不便阅读。我们希望在这种情况下，长代码自动换行就
好。 
一切的一切，其实都是需要 white-space 属性。 
解决方案 
CSS 中的 white-space 属性用于设置文本空白符的处理规则，这其中包括：
是否合并空白符、是否保留换行符、是否允许自动换行。各属性值的不同行为如
下表所示： 
white-space 属性值一览表 
属性值 空白符 换行符 自动换行 最早出现于 
nowrap 合并 忽略 不允许 CSS 1 
pre 保留 保留 不允许 CSS 1 
pre-wrap 保留 保留 允许 CSS 2.1 
pre-line 合并 保留 允许 CSS 2.1 
在 CSS1/2 下，white-space 属性只应用于块级元素； 
在 CSS 2.1 下，white-space 属性应用于所有元素。 
如果我们需要某个容器元素具有类似 
 元素的空白符处理行为，则为
它设置 {white-space: pre;} 式样即可。 
对照上表，pre-wrap 这个属性值正是我们所需要的：保留空白符，保留换
行符，允许自动换行。 
对于多行文本框提交的数据，直接为文本的容器元素设置 {white-space: 
pre-wrap;} 式样，就可以还原多行文本的真实状态。 
再来看一下上面的表格，我们发现 pre-wrap 是从 CSS 2.1 引入的属性值。
然而，目前网民使用最为广泛的 IE 6/7 浏览器是基于 CSS 1 和一部分 CSS 2 的，
它们完全不能识别 pre-wrap，当然也无法实现 pre-wrap 的空白符处理行为。 
如何在 IE 6、IE 7 下实现 pre-wrap 的效果？ 
 
这是一段多行文本数据，其中某些文本行会非常长，从而溢出容器， 
比如你现在看到的这行，行与行之间有换行符， 
但没有使用 HTML 换行标签 
 
我们需要将 .content 元素设置为 pre-wrap 式样，理想情况下只需要编写如
下 CSS 代码以了。 
.content {white-space: pre-wrap;} 
但为了应付 IE 6/7，我们需要将 CSS 代码修改如下： 
.content { 
white-space: pre-wrap; 
*white-space: pre; 
*word-wrap: break-word; 
} 
这样就可以了，我们在各浏览器中实测一下，以发现我们需要的效果完美实
现。当然，你可能注意到了，我们使用了一点儿 CSS hack。别担心，它们条理清
晰并且容易维护。在面对低能浏览器的时候，我们只能给予它们一些额外关照。 
在上面的 CSS 代码中，很显然对于标准浏览器，我们是用正常的 
{white-space: pre-wrap;} 来实现所需效果的。而对于 IE 6/7，我们使用了 CSS hack，
让它接受额外的式样声明，使用其它方法来实现类似 pre-wrap 的效果。 
首先，在 IE 6/7 下，{white-space: pre-wrap;} 这条式样声明由于不能识别而
被丢弃，我们为 .content 另外设置了 {white-space: pre;} 的式样。我们已经很熟
悉 pre 了，它的特性与我们想要的 pre-wrap 效果只有一点区别，即 pre 不允
许自动换行，也说，较长的文本行能会溢出其容器元素。 
因此，接下来，为了让这些较长的文本行自动换行，我们为 .content 元素
设置 {word-wrap: break-word;} 式样，谨慎起见，我们用 CSS hack 将这条声明隔
离给 IE6/7；不过即使将它暴露给所有浏览器，它也是无害的。这条声明负责
对 .content 元素内的文本行进行约束，并强制其换行。也说，{white-space: pre;} 
完成了识别文本换行符的任务，剩下的自动换行的任务交由 {word-wrap: 
break-word;} 来完成。 
CSS 发展至今经历了多个版本，但它对文本排版的控制仍然不够精确灵活。
微软的 IE 浏览器开发了一些私有属性，扩展了 CSS 的文本排版功能，尤其可
贵的是，这些扩展属性大多考虑到了非拉丁语系语言的排版规则。由于这些私有
扩展属性确实很有价值，它们被整理并收录到了 CSS3 草案中。 
word-wrap 属性其中很有代表性的例子。它决定了文本行超过容器的边界时
是否断开转行。目前这一属性已经得到了绝大多数主流浏览器的支持。 
回到前面的原理分析，其实我们会发现一个矛盾，{white-space: pre;} 很倔
犟地不愿换行，而 {word-wrap: break-word;} 则要求内部文本自动换行。面对这
样的冲突，浏览器如何决断？ 
在 CSS 中，控制文本换行方式的属性有很多，当发生冲突的时候，某些属
性在文本排版中的优先级更高，因而会在冲突中胜出，决定最终的文本式样。很
显然，在上面的这起冲突中，{word-wrap: break-word;} 更加强势，倔犟的文本行
最终还是乖乖地换行了。 
总结 
如果不想在网页中使用
标签，就要对提交文本进行处理。 
对于多行文本框提交的内容： 
 如果想保留基本格式，使用上面的CSS规则定义样式 
 否则，使用调整为段落。 
对于从在线编辑器提交上来的文本，将其中的
标签替换掉。 
 如果可能，改写在线编辑器脚本。 
 如果不行，就要在服务器端脚本上处理
。

合集下载

css样式文本超出宽度自动换行

css样式文本超出宽度自动换行

css样式文本超出宽度自动换行摘要：1.问题背景：网页设计中CSS 样式的问题2.解决方法：使用CSS 样式实现文本自动换行3.具体实现：使用`word-wrap`和`white-space`属性4.示例代码：展示如何使用这两个属性5.总结：回顾问题解决过程，强调自动换行的重要性正文：在网页设计中，我们常常会遇到这样一个问题：当一段文本的宽度超出容器宽度时，文本会变得不可读，影响用户体验。

为了解决这个问题，我们需要使用CSS 样式来实现文本的自动换行。

要实现文本自动换行，我们可以使用CSS 中的`word-wrap`和`white-space`属性。

`word-wrap`属性用于指定是否允许在单词内换行，而`white-space`属性用于指定如何处理元素中的空白字符和换行符。

具体实现自动换行，我们可以按照以下步骤操作：1.为包含文本的元素设置一个宽度，例如：`width: 200px;`2.为该元素添加`word-wrap: break-word;`样式，允许在单词内换行3.为了确保换行符正确显示，可以为元素添加`white-space: normal;`样式，使元素中的空白字符和换行符正常显示下面是一个简单的示例代码，展示了如何使用`word-wrap`和`white-space`属性实现文本自动换行：```html<!DOCTYPE html><html><head><style>.text-container {width: 200px;border: 1px solid black;word-wrap: break-word;white-space: normal;}</style></head><body><div class="text-container">这是一段很长的文本，可能会超出容器的宽度，我们希望在超出部分自动换行，以提高用户体验。

如何删除Word文档中的回车符、换行符

如何删除Word文档中的回车符、换行符

如何删除Word文档中的回车符、换行符
1、删除硬回车的方法(”) ：
选中所要删除的回车符（硬回车）的段落→点击编辑→查找→高级→特殊字符→段落标记（即硬回车））→替换（替换栏不输入任何字符），然后点“全部替换”，就可以了。

注：“^P”是硬回车的符号。

如图：
2、删除软回车的方法(向下的回车符“↓”)：
网页中下载的文字的回车一般都是换行符（软回车），要替换软回来，方法如下：
在word中点击菜单栏中的编辑→查找→高级→特殊字符—手动换行符（即软回车）→替换（替换栏不输入任何字符），然后点“全部替换”，就可以删除整个文档里面的软回车符了。

注：“^1”是软回车的符号这个向下箭头叫做“手动换行符”，或被称作“软回车”，就是分行不分段，word快捷键是shift＋enter。

硬回车的符号是“竖向下后左转的箭头”。

如图：。

回车与换行回车与换行

回车与换行回车与换行

“回车”（carriage return）和“换行”（line feed）这两个概念的来历和区别换行(\n)就是光标下移一行却不会移到这一行的开头,回车(\r)就是回到当前行的开头却不向下移一行. Enter键按下后会执行\n\r这样就是我们看到的一般意义的回车了,所以你用16进制文件查看方式看一个文本,就会在行尾发现"\n\r"在计算机还没有出现之前，有一种叫做电传打字机（Teletype Model 33）的玩意，每秒钟可以打10个字符。

但是它有一个问题，就是打完一行换行的时候，要用去0.2秒，正好可以打两个字符。

要是在这0.2秒里面，又有新的字符传过来，那么这个字符将丢失。

于是，研制人员想了个办法解决这个问题，就是在每行后面加两个表示结束的字符。

一个叫做―回车‖，告诉打字机把打印头定位在左边界；另一个叫做―换行‖，告诉打字机把纸向下移一行。

这就是―换行‖和―回车‖的来历，从它们的英语名字上也可以看出一二。

后来，计算机发明了，这两个概念也就被般到了计算机上。

那时，存储器很贵，一些科学家认为在每行结尾加两个字符太浪费了，加一个就可以。

于是，就出现了分歧。

Unix系统里，每行结尾只有―<换行>‖，即―\n‖；Windows系统里面，每行结尾是―<换行><回车>‖，即―\n\r‖；Mac系统里，每行结尾是―<回车>‖。

一个直接后果是，Unix/Mac 系统下的文件在Windows里打开的话，所有文字会变成一行；而Windows里的文件在Unix/Mac下打开的话，在每行的结尾可能会多出一个^M 符号。

c语言编程时（windows系统）\r 就是return 回到本行行首这就会把这一行以前的输出覆盖掉如：int main() {cout << "hahaha" << "\r" << "xixi" ;}最后只显示xixi 而hahaha 背覆盖了\n 是回车＋换行把光标先移到行首，然后换到下一行，也就是下一行的行首位置int main() {cout << "hahaha" << "\n" << "xixi" ;}则显示hahahaxixiASCII表ASCII值控制字符ASCII值控制字符ASCII值控制字符ASCII值控制字符0 NUT 32 (space) 64 @ 96 、1 SOH 33 ！65 A 97 a2 STX 34 ‖66 B 98 b3 ETX 35 # 67 C 99 c4 EOT 36 $ 68 D 100 d5 ENQ 37 % 69 E 101 e6 ACK 38 & 70 F 102 f7 BEL 39 , 71 G 103 g8 BS 40 ( 72 H 104 h9 HT 41 ) 73 I 105 i10 LF 42 * 74 J 106 j11 VT 43 + 75 K 107 k12 FF 44 , 76 L 108 l13 CR 45 - 77 M 109 m14 SO 46 . 78 N 110 n15 SI 47 / 79 O 111 o16 DLE 48 0 80 P 112 p17 DCI 49 1 81 Q 113 q18 DC2 50 2 82 R 114 r19 DC3 51 3 83 X 115 s20 DC4 52 4 84 T 116 t21 NAK 53 5 85 U 117 u22 SYN 54 6 86 V 118 v23 TB 55 7 87 W 119 w24 CAN 56 8 88 X 120 x25 EM 57 9 89 Y 121 y26 SUB 58 : 90 Z 122 z27 ESC 59 ; 91 [ 123 {28 FS 60 < 92 \ 124 |29 GS 61 = 93 ] 125 }30 RS 62 > 94 ^ 126 ~31 US 63 ? 95 —127 DELNUL VT 垂直制表SYN 空转同步SOH 标题开始FF 走纸控制ETB 信息组传送结束STX 正文开始CR 回车CAN 作废ETX 正文结束SO 移位输出EM 纸尽EOY 传输结束SI 移位输入SUB 换置ENQ 询问字符DLE 空格ESC 换码ACK 承认DC1 设备控制1 FS 文字分隔符BEL 报警DC2 设备控制2 GS 组分隔符BS 退一格DC3 设备控制3 RS 记录分隔符HT 横向列表DC4 设备控制4 US 单元分隔符LF 换行NAK 否定DEL 删除软回车（shift+enter）与硬回车（enter）硬回车（hard Return）就是普通我们按回车产生的，它在换行的同时也起着段落分隔的作用。

如何去掉word文档中的空格及制表符

如何去掉word文档中的空格及制表符

如何去掉word文档中的空格及制表符如何去掉word文档中的空格及制表符一、在网上发现一篇好文章，想要粘贴到word中以便对其重新进行排版，可是从网页上粘贴到word后，会有很多多余的空行和空格，文章短的可以一个一个地删除，可是比较长的文章编辑起来可就太费劲了。

怎样才能快速而又准确地消除这些多余的空行和空格呢？第一步：在网页上选择要复制的文字（将要选择部分拉黑），在所选择内容的部分单击鼠标右键，在弹出菜单中选择“复制（C）”单击鼠标左键，完成复制（也可使用快捷键Ctrl+C）。

第二步：进入word打开一空文档，word2003等可以用鼠标左键单击“编辑（E）”菜单，在下拉菜单中选择“选择性粘贴（S）”，在出现的对话框中选择“无格式文本”，鼠标左键单击“确定”按钮。

在word2007中可以使用快捷键Ctrl+Alt+V，在弹出的对话框中选择“无格式文本”。

第三步：用快捷键Ctrl+A选择全部文档文字，先在格式栏中选择“居中”（可用快捷键Ctrl+E），再选择“左对齐”（可用快捷键Ctrl+L）。

第四步：1、去多余空行――在“编辑”菜单中选择“替换”，在弹出对话框的“查找内容”中输入^p^p，在“替换为”中输入^p（这里^和p都必须在英文状态下输入），然后单击“全部替换”即可（可以多次单击“全部替换”，直到出现“word已完成对文档的搜索并已完成0处替换”）。

2、去多余空格――在“编辑”菜单中选择“替换”，在弹出对话框的“查找内容”中输入一个空格，在“替换为”中什么也不输入，然后单击“全部替换”即可（可以多次单击“全部替换”，直到出现“word已完成对文档的搜索并已完成0处替换”）。

3、去掉换行符——在“编辑”菜单中选择“替换”，在弹出对话框的“查找内容”中输入一个^p(或^l)，在“替换为”中什么也不输入，然后单击“全部替换”即可（可以多次单击“全部替换”，直到出现“word已完成对文档的搜索并已完成0处替换”）。