网页文字换行问题求教

V2EX = way to explore

V2EX 是一个关于分享和探索的地方

现在注册

已注册用户请登录

Can I use?

› http://caniuse.com/

Less

› http://lesscss.org

Cool Libraries

› Bootstrap from Twitter

› Jetstrap

这是一个创建于 4568 天前的主题，其中的信息可能已经有所发展或是发生改变。

为何行尾会出现空格？查了一下相关 CSS 、不知道怎么改求教。

求教

行尾

CSS

16 条回复 • 1970-01-01 08:00:00 +08:00

krazy

2012-06-26 14:58:12 +08:00

文本过长？
试试word-break: break-all;

lianghai

2012-06-26 15:11:16 +08:00

你连示例页面都不给，谁知道具体是什么情况。

永远不要用 word-break: break-all，除非你完全不需要标点避头尾，也可以接受恶心的西文单词自由断行。

tuoxie007

2012-06-26 15:47:55 +08:00

@lianghai 那也没办法，前几天遇到一个超长文本，全是英文字符，中间没有空格，然后就就横着出去了，然后我就被说了

NemoAlex

2012-06-26 16:08:08 +08:00

@tuoxie007
@lianghai 使用 overflow-wrap(又名word-wrap):break-word 是比较好的选择

sayori

2012-06-26 16:17:08 +08:00

@lianghai 感谢

这个是我本地学习实验遇到的

刚才发现是 PADDING-RIGHT 设置得小了。改成超过字体大小的值就搞定了。

okidogi

2012-06-26 16:19:17 +08:00

text-align: justify

lianghai

2012-06-26 16:22:12 +08:00

@tuoxie007: 如 @NemoAlex 所说。

lianghai

2012-06-26 16:24:54 +08:00

@sayori: 啊？padding-right 和这个有什么关系？

sayori

2012-06-26 16:33:51 +08:00

@lianghai 我也不知道....这些文字是放在一个<li>里的
然后右边距原来是3PX 就像这样有空格改成12PX 就行了。

sayori

2012-06-26 16:37:32 +08:00

不对我再看了下还是不行。
再研究看看。

sayori

2012-06-26 16:40:07 +08:00

难道这个是不能解决的，看了下饭否和新浪微博也有这种换行都不能完美对齐呢。

zsdsz

2012-06-26 17:03:12 +08:00

@sayori 应用是受标点符号影响吧看V2ex右边的广告也这样

NemoAlex

2012-06-26 17:47:14 +08:00

@zsdsz 如果要左右对齐，可以使用 text-align: justify
注意应用的元素的 display 要是 block ，inline 是无效的

lianghai

2012-06-26 21:43:13 +08:00

@sayori: 大家热心想帮你解决问题，你却连个示例页面或代码都不给，只知道在那里自言自语。真是无法理解。

benzhe

2012-06-26 22:26:55 +08:00

LZ 想要的是这个？

text-align: justify;
letter-spacing: normal;
white-space:normal;
display: block;
word-break: break-all;
word-wrap: break-word;

另外如果中英混合，这么做貌似十分恶心

sayori

2012-06-26 23:04:49 +08:00

谢谢大家不是我不发代码是根本没有代码。
只是随便复制了一段文字到本地装的WP里发布就出现的状况。127.0.0.1我也没法啊。
就是一段简单的<li><a>....<a></li>并且没有非常规的CSS语句在控制。
我看了新浪微博和饭否，他们的换行也有这种问题。
好吧是我问得找了，等我把这个传到互联网再问就对了。。

网页文字换行问题 求教

网页文字换行问题求教