软件开发|编程技术|编程代码|编程入门先学什么—程序设计语言

css – 浏览器兼容的word wrap和whitespace:pre?

收集整理的这篇文章主要介绍了css – 浏览器兼容的word wrap和whitespace:pre?,小编觉得挺不错的,现在分享给大家,也给大家做个参考。
我需要一个div内的文本来保存并包装。到目前为止,我遇到困难的时候想出了一个解决方案。我能够找到的最佳解决方案对所有浏览器都无效。

以下工作在Chrome和IE6中,但在Firefox中,文本未包装。

white-space: pre;  word-wrap: break-word;

我发现,无论什么原因,文本不会在Firefox中包含空格:pre。而-moz-pre-wrap在Firefox 3.5中不起作用(为什么?),只能预先包装。但是当我添加预包装到列表中时,IE 6和7不起作用。很沮丧

代码:

.introsub {  position: relative;  top: 30px;  left: 25px;  width: 550px;  font-weight: normal;  line-height: 1.5em;  overflow: auto;  margin: 0;  padding: 1.5em;   white-space: pre;   word-wrap: break-word;}

解决方法

CSS3属性并不总是能像我们想要的那样工作:)。
不过,我并没有看到混合白色空间的一点:pre和word-wrap:break-word。

前者不会包含文本,除非 br /遇到标签第二个会做相反的事情:即使在一个字的中间,也可以在必要的时候打破话语。他们似乎在冲突,最明显的答案是为什么不同的浏览器对这些属性的反应是不同的

他们支持两个属性之一
因为它们是冲突的,所以每个浏览器的优先级是不确定的或不同的

(我不能确定,我在这里不是一个专家)。

我建议你仔细看看this和this,然后决定在你的具体情况下应该使用什么。

[编辑]

你可能想尝试这个(应该在所有浏览器中工作):

white-space: -moz-pre-wrap; /* Firefox */white-space: -pre-wrap; /* ancient Opera */white-space: -o-pre-wrap; /* newer Opera */white-space: pre-wrap; /* Chrome; W3C standard */word-wrap: break-word; /* IE */

我没有测试过,但我相信它应该为你做的伎俩。

总结

以上是为你收集整理的css – 浏览器兼容的word wrap和whitespace:pre?全部内容,希望文章能够帮你解决css – 浏览器兼容的word wrap和whitespace:pre?所遇到的程序开发问题。