为了账号安全,请及时绑定邮箱和手机立即绑定

如何将单列标题文本换行到jqgrid中的多行

如何将单列标题文本换行到jqgrid中的多行

九州编程 2019-08-19 15:42:31
如何将单列标题文本换行到jqgrid中的多行如果列标签文本宽于列宽,则标签文本将被截断。增加列宽并不好,因为有些文本很长。如何使文字换行成多行?标题高度应由最大列高确定。我发现的唯一解决方案是但这并没有实现文字的自动换行。如何实现标题文本的自动换行?更新。我为角色和自动换行尝试了Oleg风格。字符包装    th.ui-th-column div{word-wrap: break-word; /* IE 5.5+ and CSS3 */     white-space: pre-wrap; /* CSS3 */     white-space: -moz-pre-wrap; /* Mozilla, since 1999 */     white-space: -pre-wrap; /* Opera 4-6 */     white-space: -o-pre-wrap; /* Opera 7 */     overflow: hidden;     height: auto;     vertical-align: middle;     padding-top: 3px;     padding-bottom: 3px}仅显示第二行的一半。第三行根本没有显示:自动换行  th.ui-th-column div{    white-space:normal !important;    height:auto !important;    padding:2px;    }禁用包装列的列大小调整。在那些列上移动鼠标图标到列分隔符鼠标光标不会更改为sizer。包裹的列无法调整大小。如何解决这些问题?更新2我尝试了字符换行(Oleg回复中的最后一个样本)。如果列宽减小,我发现问题,以便标题中出现更多行:如果在列分隔符底部拖动,则无法调整列的大小:调整大小时不会增加缩放器高度。在IE9标题中,高度增加是不够的:调整大小后,最后一个标题行不可见。在fireFox中,此问题不会发生。
查看完整描述

3 回答

?
慕虎7371278

TA贡献1802条经验 获得超4个赞

<style type="text/css">
    .ui-jqgrid .ui-jqgrid-htable th div    {
        height: auto;
        overflow: hidden;
        padding-right: 4px;
        padding-top: 2px;
        position: relative;
        vertical-align: text-top;
        white-space: normal !important;
    }</style>


查看完整回答
反对 回复 2019-08-19
?
慕田峪7331174

TA贡献1828条经验 获得超13个赞

Following code wraps row data.ui-jqgrid tr.jqgrow td    {           
        word-wrap: break-word; /* IE 5.5+ and CSS3 */
        white-space: pre-wrap; /* CSS3 */
        white-space: -pre-wrap; /* Opera 4-6 */
        white-space: -o-pre-wrap; /* Opera 7 */
        white-space: normal !important;
        height: auto;
        vertical-align: text-top;
        padding-top: 2px;
        padding-bottom: 3px;
    }Following code wraps table header data    
    .ui-jqgrid .ui-jqgrid-htable th div        {
          word-wrap: break-word; /* IE 5.5+ and CSS3 */
        white-space: pre-wrap; /* CSS3 */
        white-space: -pre-wrap; /* Opera 4-6 */
        white-space: -o-pre-wrap; /* Opera 7 */
        white-space: normal !important;
        height: auto;
        vertical-align: text-top;
        padding-top: 2px;
        padding-bottom: 3px;
        }


查看完整回答
反对 回复 2019-08-19
  • 3 回答
  • 0 关注
  • 930 浏览

添加回答

举报

0/150
提交
取消
意见反馈 帮助中心 APP下载
官方微信