关闭

如何改变extjs中gridpanel单元格边框,上下边框

1766人阅读 评论(0) 收藏 举报
分类:
 

看了一下Extjs中html代码会知道,extjs中gridpanel中的表格是通过<div><table><tbody><tr><td><div>content式的结构书写的。要改变单元格边框的样式就要改变Ext-all.css中.x-grid3-row这个样式。这个样式是应用到最外层div上的。

全局改变只需改变Ext-all.css里面的.x-grid3-row样式

比如你想去掉边框可以这样:

一、.x-grid3-row{cursor:default;border:0px solid #fff;border-top-color:#fff;width:100%;}

如果想个性一点,自己要定义一个样式然后应用到特定的行如:

一、.my-x-grid3-row{cursor:default;border:0px solid #ccc,border-top-color:#fff;width:100%;}

二、应用样式,获取div

var view=grid.getView();

var rows=view.getRows();//获取所有的行

var row=rows[0];//获取单行,就是你想改变的那一行,rows[1],rows[2].....都可以,就看你有多少列了

var cls= Ext.get(row);//获取ext中外层div对象

cls.removeClass("x-grid3-row");//去掉原来的样式

cls.addClass("my-x-grid3-row");//加上自己的样式

这样你会发现原来的边框不见了。大家可以举一反三改变其他样式。

ps:extjs中css中核心的部分是Ext-all.css,所以大家要是想改变样式直接改变里面的东西就ok啦

0
0

查看评论
* 以上用户言论只代表其个人观点,不代表CSDN网站的观点或立场
    个人资料
    • 访问:102736次
    • 积分:1458
    • 等级:
    • 排名:千里之外
    • 原创:39篇
    • 转载:23篇
    • 译文:0篇
    • 评论:8条
    最新评论