我刚刚开始使用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/

10-12 01:45