我在启用排序的 mvc 网络应用程序中使用 webgrid。
var grid = new WebGrid(
source: Model,
canPage: false,
ajaxUpdateContainerId: "mainGrid"
);
如果属性 canSort=true(默认情况下),则标题名称的字体颜色始终为蓝色(尽管我使用 css),但我想将其更改为其他颜色。
我怎样才能保持启用排序?
我的代码:
查看:
@grid.GetHtml(
columns: grid.Columns(
grid.Column(header: "", columnName: "isChecked", canSort: false,
format: @<text><input type="checkbox" name="checkbox_selected" value="@item.index" /></text>),
grid.Column(header: "Имя", columnName: "name", style: "name"),
grid.Column(header: "Тип", columnName: "type", style: "type"),
grid.Column(header: "Дата изменения", columnName: "date", style: "date"),
grid.Column(header: "Размер", columnName: "size", style: "size")
),
tableStyle: "grid_table",
headerStyle: "header_table",
rowStyle: "row_table",
alternatingRowStyle: "alt-row_table"
)
CSS:
.header_table
{
background-color: limegreen;
color: black;
padding-bottom: 4px;
padding-top: 4px;
}
所有其他样式正常工作,但 .header_table color 在启用排序时不起作用(禁用时它起作用)。
最佳答案
在 View 中呈现网络网格时,指定 CSS 类名称:
<div>
@grid.GetHtml(
tableStyle: "webgrid-table",
headerStyle: "webgrid-header",
footerStyle: "webgrid-footer",
alternatingRowStyle: "webgrid-alternating-row",
selectedRowStyle: "webgrid-selected-row",
rowStyle: "webgrid-row-style",
mode: WebGridPagerModes.All,
columns:
// ... more stuff here
</div>
我们现在可以为网格指定 CSS 样式并去掉蓝色(我假设呈现蓝色是因为标题包含链接(<a>
标签),因此第二个 CSS 声明:
.webgrid-header { color: #FF0000; background-color: #00FF00; }
.webgrid-header a { color: #FF0000; }
本页有更详细的解释:https://stick2basic.wordpress.com/2013/04/10/how-to-set-webgrid-style-in-mvc/
希望对您有所帮助!
关于css - 如何设置 webgrid 标题的自定义字体颜色?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/42038785/