grid中实现换行

发布时间:2017-6-28 13:25:45 编辑:www.fx114.net 分享查询网我要评论
本篇文章主要介绍了"grid中实现换行",主要涉及到grid中实现换行方面的内容,对于grid中实现换行感兴趣的同学可以参考一下。

在工作中碰见了这样一个问题:在用htmleditor编辑器编写的内容在grid的列中显示的时候可以显示全部内容(这时会将这一列撑起来)而在用textarea编辑的内容则不会显示完全。 后来知道是因为textarea的底部样式导致的:.x-grid-cell-inner中的text-overflow,white-space 在这里简单说下这两个样式: text-overflow  在Ext的样式为 clip text-overflow: clip  不显示省略标记,直接截取 text-overflow:ellipsis 当对象文本溢出时显示省略标记 white-space 在Ext的样式为 nowrap 在这两个样式中只修改white-space为normal就可以(如果改底部样式所有grid的显示都将改变) 因为在工作中有可能不是将所有的grid的样式都改为显示全部内容撑开行高,因此我们要在所在的列中更改样式 在要显示的列的renderer事件中更改 renderer: function (v, m, r) {            m.attr ='style="white-space:normal;word-wrap:break-word;word-break:break-all;"';           return v;        } 好了,就上面的三行代码就OK啦(O(∩_∩)O~说了那么多废话就三句重点*^_^*) 在m.attr中还可以给所在列添加其他样式,以个人需要添加 添加word-wrap:break-word;word-break:break-all;这两个样式用于改进浏览器兼容问题(在火狐英文和数字不换行) 至此IE,谷歌,火狐都可换行

上一篇:isset----is_null----empty-----的区别
下一篇:U-Boot移植(二)——U-Boot编译过程分析(4)

相关文章

相关评论

本站评论功能暂时取消,后续此功能例行通知。

一、不得利用本站危害国家安全、泄露国家秘密,不得侵犯国家社会集体的和公民的合法权益,不得利用本站制作、复制和传播不法有害信息!

二、互相尊重,对自己的言论和行为负责。