我看过很多个解决方法,综合修改出这个。。支持ie/ff/op/sf
这里的浏览器检测代码来自jQuery。。
var userAgent = navigator.userAgent.toLowerCase();
var browser = {
version: (userAgent.match(/.+(?:rv|it|ra|ie)[/: ]([d.]+)/) || [])[1],
safari: /webkit/.test(userAgent),
opera: /opera/.test(userAgent),
msie: /msie/.test(userAgent) && !/opera/.test(userAgent),
mozilla: /mozilla/.test(userAgent) && !/(compatible|webkit)/.test(userAgent)
};
function toBreakWord(str, intLen){
var strTemp = '';
if ((browser.mozilla || browser.opera) && str.length > intLen) {
while(str.length > intLen){
strTemp += str.substr(0,intLen)+" ";
str = str.substr(intLen, str.length);
}
str = strTemp + str;
}
document.write(str);
}
使用方法
<div style="width:25px;border:1px solid;word-break:break-all;"><script type="text/javascript">toBreakWord('fffffffffffffffffffffffffffffffffffffff', 3)</script></div>
分享到:
相关推荐
值得注意的是,`word-break` 属性在某些浏览器中可能存在问题,如Opera和Firefox可能不支持,这时可以考虑使用 `white-space:normal` 作为替代方案。此外,使用空格分隔单词而不是使用` `(非破折号空格)也是确保...
`word-wrap`属性在现代浏览器中的兼容性非常好,包括Chrome、Firefox、Safari、Opera和Internet Explorer 8及以上版本。这意味着你可以在大多数设备上安全地使用这个属性,为用户提供一致的视觉体验。 ### 3. `word...
对于不支持 `word-wrap` 的浏览器,如 Firefox 3.0 和 Opera,可以使用 `overflow-x:hidden` 来隐藏溢出的内容。然而,这种方法虽然解决了溢出的问题,但也可能导致部分内容无法被用户看到。因此,为了更好的跨...
在跨浏览器兼容性方面,需要注意`word-break`属性在某些浏览器(如Opera和Firefox)中可能不受支持,这时可以使用`white-space:normal`来替代,以确保在多种浏览器下的正常换行。然而,单纯使用空格来代替单词间的...
- `word-break:break-all` 在IE5以上版本得到支持,但Opera和Firefox可能不支持。可以使用 `white-space:normal` 替代 `word-break` 在Firefox和IE下达到类似效果。然而,这样做可能会影响百度快照的展示,且需要...
而其他如 `-moz-pre-wrap`, `-hp-pre-wrap`, `-o-pre-wrap`, `-pre-wrap`, `pre`, 和 `pre-line` 是为了兼容早期的浏览器版本和特定环境,例如Mozilla Firefox、Opera等。 另外,还可以通过添加 `word-break: break...
` 和 `word-wrap: break-word;` 配合使用,确保文本可以按照单词边界或者字符边界进行换行。 - `white-space` 的一系列值是为了兼容不同的浏览器版本。比如,`-moz-pre-wrap` 是为了Firefox,而`-o-pre-wrap` 是...
例如,`box-sizing`在Firefox中需要`-moz-box-sizing`,而`column-count`在IE10+和Opera才支持。 综上所述,CSS3的新特性极大地扩展了Web设计的可能性,让网页更加美观、交互性更强。开发者应根据项目需求和目标...
important`:为老版本的 Firefox 添加支持,`!important` 确保此设置优先级高于其他样式。 3. `white-space: -pre-wrap` 和 `white-space: -o-pre-wrap`:分别用于更早版本的 Opera 浏览器,确保兼容性。 4. `word-...
- `word-wrap: break-word;`(在某些版本的 IE 中是 `word-wrap`,在现代浏览器中是 `overflow-wrap`):允许单词在必要时断开,以防止内容溢出其容器。这对于处理非常长的无空格字符串尤其有用。 结合上述属性,...
IE 支持 `word-wrap: break-word` 来实现自动换行,而 Firefox 则需要使用其他属性或方法来达到相同的效果。 以上列举了CSS中常见的浏览器兼容性问题及解决方法。开发者在进行前端开发时,需要时刻关注这些差异,并...
这段 CSS 代码确保了在主流浏览器(包括 IE6、IE7、IE8、Firefox、Opera、Safari 和 Chrome)中,`<pre>` 标签内的文本能够正确地自动换行,同时保持原有的格式。`word-wrap: break-word;` 属性允许单词在必要时进行...
`和`word-wrap: break-word;`确保文本在容器边缘处能够换行,而不是全部显示在一行内。 具体实现步骤如下: 步骤1:使用`<pre>`标签包裹输出的变量。在JSP页面中,可以使用EL表达式(例如`从数据库显示的字段%>`)...
` 在 IE6-7 和 Opera 中被支持,但在 Safari 和 Firefox 中不支持。 **解决方案**:使用 `cursor: pointer;` 替代。 ```css .link { cursor: pointer; } ``` **解释**:`cursor: pointer;` 是跨浏览器支持的手型...
而在Firefox中,由于它默认支持文本自动换行,所以通常不需要额外的CSS hack。但如果需要通过JavaScript来实现,可以使用以下脚本: ```html function toBreakWord(intLen, id) { var obj = document....
**解决方法**:设置`<td>`的`word-wrap`属性为`break-word`或`white-space`属性为`nowrap`。 ```css td { word-wrap: break-word; /* 或者 white-space: nowrap; */ } ``` 以上列举了一系列常见的浏览器兼容性...