禁用列表视图截断头jQuery Mobile的长文本（一个字） [英] Disable truncate listview header jquery mobile for long text (single word)

问题描述

我有一个jQuery Mobile的列表视图。目前在列表视图的标题截断，并用...的文字结束。我想禁用此行为，并显示完整的文本。我跑进几个解决方案但没有人对一个字工作。即，无空白的文字，例如电子邮件地址无效。

解决方案

  

演示

您正在寻找的CSS是自动换行：打破字;

  UL李H2 {
    白色空间：正常重要;！
    自动换行：打破字;
    溢出换行：打破字;
}
 

有关更多的浏览器支持，你可以尝试：

  UL李H2 {
    空格：pre重要;！ / * CSS 2.0 * /
    空格：pre-包装很重要;！ / * CSS 2.1 * /
    空格：pre系列重要;！ / * CSS 3.0 * /
    空格： -  pre-包装很重要; / *歌剧4-6 * /
    空格：-O- pre-包装很重要;！ / *歌剧7 * /
    空格：-moz- pre-包装很重要;！ / * * Mozilla的/
    空格：-hp- pre-包装很重要;！ / * HP打印机* /
    自动换行：打破字; / * IE 5+ * /
}
 

I have a jquery mobile listview . Currently the header of the list view truncates, and the text ends with a "...". I would like to disable this behavior and show the complete text. I ran into a few solutions but none of them work for a single word. i.e, text without white space, for example an email address does not work.

解决方案

DEMO

The CSS you are looking for is word-wrap:break-word;

ul li h2 {
    white-space: normal !important;
    word-wrap:break-word;
    overflow-wrap: break-word;
}

For more browser support you could try:

ul li h2{
    white-space: pre !important;           /* CSS 2.0 */
    white-space: pre-wrap !important;      /* CSS 2.1 */
    white-space: pre-line !important;      /* CSS 3.0 */
    white-space: -pre-wrap !important;     /* Opera 4-6 */
    white-space: -o-pre-wrap !important;   /* Opera 7 */
    white-space: -moz-pre-wrap !important; /* Mozilla */
    white-space: -hp-pre-wrap !important;  /* HP Printers */
    word-wrap: break-word;      /* IE 5+ */
}

这篇关于禁用列表视图截断头jQuery Mobile的长文本（一个字）的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！