我今天遇到了一个有趣的问题.我有一封我从网页发送的短信.我正在显示预览,并希望将预览保留为固定字体,保留空白区域,因为这是纯文本电子邮件的显示方式.
基本上我想要一些像记事本一样的东西:新行将发出换行信号,但文本将以其他方式换行以适应其内容.
不幸的是,除非我遗漏了一些非常明显的东西,否则这很难实现.我试过了:
> CSS white-space:pre.这样可以保留空白区域,但不会包裹文本行,因此它们会在长行中出现边框;
>将textarea元素设置为只读,没有边框,因此它基本上像div一样.这里的问题是IE在严格模式下不喜欢textareas的100%高度.奇怪的是,他们在怪癖模式下也没关系,但这对我来说不是一个选择.
> CSS white-space:预包装.这是CSS 2.1所以可能没有被广泛支持(我很高兴,如果它在IE7和FF3中受支持;我不关心IE6这个作为它的管理功能,没有人会运行IE6将使用此页面) .
还有其他建议吗?这真的很难吗?
编辑:无法评论所以更多信息.是的,目前我正在使用字体Courier New(即固定宽度)并在服务器端使用正则表达式用< br>替换换行符.标签,但现在我需要编辑内容,它只是让我感到尴尬,你需要剥离并添加< br> s使其工作.
有没有更好的方法?
解决方法
尝试
selector { word-wrap: break-word; /* IE>=5.5 */ white-space: pre; /* IE>=6 */ white-space: -moz-pre-wrap; /* For Fx<=2 */ white-space: pre-wrap; /* Fx>3,Opera>8,Safari>3*/ }