HTML更改换行符触发器?

Myf*_*wik 5 html css css3 web

在CSS/HTML中是否有任何方法可以更改哪些字符导致文本中的换行符被允许?例如,如果我有包含文本"fooooooo/barrrrrrrrr"的表数据,它将不会分成两行,但如果它包含"fooooooo barrrrrrrrr",它将会.

有没有办法在可以触发换行的地方添加标点字符?

Juk*_*ela 10

CSS/HTML中无法更改导致,允许或阻止文本中的换行符的字符集.但是,每次出现一个角色都可能会影响这些事情.也就是说,你不能一般地说"允许'/'之后的换行符",但是你可以在特定的"/"之后注入一些标记或内容以允许在那里换行.

请注意,浏览器具有不同的换行行为.例如,Opera将斜杠"/"视为允许后面的换行符.行为还可能取决于上下文.在浏览器中查看我的页面.

对于任何了解实用方法并且不太担心标准化者不愿意接受它的人来说,过去认为这很简单:<wbr>标签.它仍然是一种简单实用的方式,例如fooooooo/<wbr>barrrrrrrrr,它不再是最常用的跨浏览器方式.更新的方式,零宽度空间U + 200B,可以用&#x200b;HTML 编写,在现代浏览器上运行良好,但在一些旧版本的IE上,它会造成混乱(显示一个小矩形,此控制字符出现).

如果您愿意使用有些冗长的代码,可以将这两种方式结合起来.您可以使用两者<wbr>和内联元素,其中包含空内容但零宽度空间作为生成内容.这避免了IE 6上的问题,因为它不支持CSS中生成的内容(但识别<wbr>标记).例:

fooooooo/<wbr><a class=wbr></a>barrrrrrrrr
Run Code Online (Sandbox Code Playgroud)

使用CSS代码

.wbr:after { content: "\00200B"; }
Run Code Online (Sandbox Code Playgroud)

测试和演示:jsfiddle.


Nel*_*son 5

您可以使用css word-wrap 属性,这样您的长单词就会根据其容器宽度而被破坏:

word-wrap: break-word;
Run Code Online (Sandbox Code Playgroud)