对话框中的多行标题

Multiline title in dialog?

本文关键字：标题 对话框      更新时间：2023-09-26

我怎样才能有一个标题多于一行的JQuery对话框?

参见:http://jsfiddle.net/VKcJ7/7/

我试过使用换行符，并摆弄JQuery UI CSS类的标题&标题栏，但似乎没有工作。

JS:/JQuery: 
$(document).ready(function () {
    $('#dialog').dialog({
        autoOpen: false,
        modal: true,
        title: 'Something really long wow 'n too much to have in a title but oh well'
        //adding the newline character 'n does nothing!
    });
});
CSS: 

.ui-dialog-title{
}
.ui-dialog-titlebar{
}

.ui-dialog-title有css使溢出文本被截断为…(省略)。

white-space: nowrap;
text-overflow: ellipsis;

使用下面的css应该可以解决这个问题。

white-space: normal;
编辑:

生成white-space: normal将忽略text-overflow声明。

将white-space属性设置为normal 

 .ui-dialog .ui-dialog-title{
     white-space: normal;
    }
http://jsfiddle.net/VKcJ7/20/

答案很简单。jQuery UI正在添加一个

white-space: nowrap;

到每个标题

在你的CSS中使用下面的代码:

.ui-dialog-title{
   white-space: normal;
}

请确保在jquery-ui CSS文件之后加载CSS，以便加载您的设置。否则你就得用'!像这样重要:

.ui-dialog-title{
   white-space: normal !important;
}

很难看

相关文章：