能不能不换行用css把字符截一下

html-css014

能不能不换行用css把字符截一下,第1张

你是说不换行,只有一行,超出部分变为省略号或者说让比如“北京”这样的固定用词拆开?

如果是这样的话,css可以用:

text-overflow:ellipsis(超出部分变为省略号)

white-space: nowrap(文本不会换行,文本会在在同一行上继续,直到遇到 <br>标签为止)

word-break:break-all(允许在单词内换行,就是拆开固定用词的)

word-break:keep-all(只能在半角空格或连字符处换行)

word-wrap:break-word(允许长单词或 URL 地址换行到下一行,用于英文较多)

你的问题不是很明显,这是我理解的你的问题能想到帮到你的,你自己看看吧

解释:

1、反反复复反反复复发反反复复反反复复反反复复发反反复复反反复复反反反反复复发反反复复

这个浏览器认为是一段话,就是 反 反 复 复 是一个一个得字符。然后就会自动换行。

2、sssssssssssssssssssssssssss

这个浏览器认为是一个单词(貌似单词很长的说),但是确实就是一个very long的单词 单词是不会存在换行的。再举个例子ssssssssssssssss aaaaaaaaaaaaaaaaa 中间有个空格,那么他们就是两个单词了,要是连在一起 就是一个单词了。

解决办法:

首先说一下,ssssssssssssssssssssssss现实生活基本碰不上,除非有人恶搞...

在CSS中补上{overflow:hidden}

******************************************

楼上说的word-break是IE私有属性。ff不支持。

另外即使用也要用word-wrap:break-word;因为word-break:break-all就是所有英文都要换行,会把单词截断的,影响阅读。

word-break:break-all //把英文单词不管三七二十一给弄断了,影响阅读。

word-wrap:break-word //不仅可以把超级长的英文单词截断,还可以根据空格区分英文单词,保持它的可读性。

最后FF不支持上面两个。

再说,还是那句话sssssssssssssssssssssssssssssss现实生活基本碰不上,除非有人恶搞...