我刚刚开始使用SlickGrid并对其质量感到惊讶。但是,在样式方面,我找不到任何推荐整体样式方法的文档或示例。选项和API分散在各个地方,但是要从中提取策略是非常困难的。网格还利用了jQuery UI主题。不幸的是,那些干扰了我想要达到的目标。我们仅针对日历小部件以及ui-darkness主题选择了jQuery UI。这个主题对于日历窗口小部件来说效果很好,但是网格需要覆盖它的各个方面。
这是一个jsFiddle,显示了我想要实现的外观:http://jsfiddle.net/nareshbhatia/3q6RD/。仅出于说明目的,它使用常规的HTML表。但是我想使用SlickGrid实现完全相同的样式。这个jsFiddle中的CSS本质上是我对视觉设计师的要求,例如
#positions-table th {
background-color: #505050;
color: #eeeeee;
text-shadow: none;
font-size: 13px;
height: 40px;
line-height: 40px;
}
编辑:我还使用入门SlickGrid实现http://jsfiddle.net/nareshbhatia/vJshY/创建了一个jsFiddle。如您所见,ui-darkness主题已完全接管!
最佳答案
在您的第二个/最后一个jsFiddle中,您可以修改CSS以包含此代码
.slick-header-column.ui-state-default {
background:none ;
background-color: #505050 ;
color: #eeeeee;
border: none;
padding: 0;
text-shadow: none;
font-family: Arial, Verdana, Helvetica, sans-serif;
font-size: 13px;
height: 40px;
line-height: 40px;
}
.slick-row.ui-widget-content, .slick-cell {
background: none;
background-color: #eeeeee;
color: #666666;
border: none;
border-bottom: solid 1px #ffffff;
font-size: 14px;
height: 60px;
line-height: 60px;
padding: 0 5px;
}
关于css - 推荐的SlickGrid样式设置方法是什么?,我们在Stack Overflow上找到一个类似的问题:https://stackoverflow.com/questions/17262236/