如何跨浏览器使用连续字符的换行
作者：blank 来源：怿飞blog 发布时间：2008-07-06 23:10:00
标签：浏览器,换行,字符,Firefox
由于连续的字符（字母、符号、数字）在默认情况下是不换行的，可能会破坏整个界面布局。
那如何解决这个问题呢？
在 IE 和 Safari 1.3+ 下相对比较容易解决，使用 CSS 属性 word-wrap: break-word;。有朋友会问为什么不是使用 word-break:break-all; ，因为有一个特殊的情况，该属性无法解决换行——连续的英文标点符号。
注：word-break 主要使用在 CJK 文本，即：中文（Chinese）、日文（Japanese）、韩文（Korean）。
而 Firefox 和 Opera 浏览器，无法识别 word-wrap: break-word; 和 word-break:break-all; 属性。可以通过脚本给连续字符的每个字符之间插入 \ u8203 的字符（该字符在非 IE 浏览下不占据空间），使连续变为了不连续，达到了换行的效果。
breakWord = function(dEl){
var dWalker = document.createTreeWalker(dEl, NodeFilter.SHOW_TEXT, null, false);
var node,s,c = String.fromCharCode('8203');
while (dWalker.nextNode()){
node = dWalker.currentNode;
s = trim( node.nodeValue ) .split('').join(c);
node.nodeValue = s;
}
return true;
}
详细的脚本，可参看 Hedger Wang 整理的脚本《Cross Browser Word Breaker》
对于 Firefox ，你还可以通过 XBL bindings 来实现此效果：《Emulating CSS word-wrap for Mozilla/Firefox》
0
投稿猜你喜欢
- 以前在一个图书类网站看到这样一个功能：客户可以按条件搜索书目的信息，服务器会将符合条件的信息筛选出来保存为一个Excel文件供客户下载。今天
译者newstart写的简介：Ross Dawson所在的Future Exploration Network于2007年5月发布的web2- 1. DBeaver连接mysql 1） 下载DBeaver https://dbeaver.io/download/，
- 一、tensor的创建1.使用tensor小写字母的tensor接收具体的数据，可以直接按照numpy的方式输入数组。2.使用Tensor大
- 本文实例讲述了python实现将pvr格式转换成pvr.ccz的方法。分享给大家供大家参考。具体实现方法如下：import zlibimpo
- 1.go项目在window下编译简易打包1).在windows下直接编译生成main.exe文件在项目main.go同级目录下执行以下命令g
- 年关将近，抽奖想必是大家在公司年会上最期待的活动了。如果老板让你做一个年会抽奖的程序，你会怎么实现呢？今天给大家介绍一下如何通过 SQL 语
- 什么是Firebug从事了数年的Web开发工作，越来越觉得现在对WEB开发有了更高的要求。要写出漂亮的HTML代码；要编写精致的CSS样式表
- 由于工作需要在一大堆日志里面提取相应的一些固定字符，如果单纯靠手工取提取，数据量大，劳心劳力，于是自然而然想到了用Python做一个对应的提
- SQL SERVER 2000用sql语句如何获得当前系统时间就是用GETDATE();Sql中的getDate()Sql Server 中
- 1. MySQL主从同步实现方式MySQL主从同步是基于Bin Log实现的，而Bin Log记录的是原始SQL语句。Bin Log共有三种
- 先给大家说下什么是localstorage前几天在老项目中发现有对cookie的操作觉得很奇怪，咨询下来是要缓存一些信息，以避免在URL上面
- 异常，不应该存在，但是我们有时候会遇到这样的情况，比如我们监控服务器的时候，每一秒去采集一次信息，那么有一秒没有采集到我们想要的信息，但是下
- 学习目标：对二值图进行分析，设定最大最小面积区间保留该面积区间内的区域示例代码//src为二值图，minArea、maxArea为面积阈值，
- 本文实例讲述了PHP学习记录之面向对象（Object-oriented programming，OOP）基础。分享给大家供大家参考，具体如下
- window对文件夹的操作主要包括移动/剪切/复制，本篇文章主要用jQuery来实现，下面一起来了解一下把。1.先看下效果吧！2.在添加一个
- 平时我们写个脚本，要放到后台执行去，我们怎么做呢？nohup python example.py 2>&1 /dev/null
- 日志文件一般是按天产生，则通过在程序中判断文件的产生日期与当前时间，更换监控的日志文件程序只是简单的示例一下，监控test1.log 10秒
- 背景目前项目在移动端上，首推使用微信小程序。各项目的小程序访问数据有必要进行采集入库，方便后续做统计分析。虽然阿拉丁后台也提供了趋势分析等功
- 最近，我喜欢上了ＸＭＬ编程，但又苦于它的美观程度又不够，找了许多书才搞定。 &n
