在我的一个视图中,我有一个 webgrid。我想添加一些样式属性,但是当我在项目的 css 文件中添加它们时它不起作用。但是,当我在视图中使用样式标签添加它时,它可以工作。此外,视图的所有其他元素都根据 css 文件进行格式化,除了 webgrid。
可以从 CSS 文件格式化 webgrid 吗?
编辑
var grid = new WebGrid(canPage: true, rowsPerPage: 10, canSort: true, ajaxUpdateContainerId: "grid");
grid.Bind(model, rowCount: Model.ToList().Count(), autoSortAndPage: false);
grid.Pager(mode:WebGridPagerModes.All,
firstText:"First", lastText:"Last",
previousText:"Previous",
nextText:"Next",
numericLinksCount: 15);
@grid.GetHtml(htmlAttributes: new { id = "grid" },
tableStyle: "webgrid",
headerStyle: "webgrid-header",
footerStyle: "webgrid-footer",
alternatingRowStyle: "webgrid-alternating-row",
selectedRowStyle: "webgrid-selected-row",
rowStyle: "webgrid-row-style",
columns: grid.Columns(
grid.Column(columnName: "column1", header: "column 1r"),
grid.Column(columnName: "column2", header: "column 2", canSort:true),
grid.Column(format: (item) => Html.ActionLink("Detail", "Detail", new { JobNumber = item.JobNumber, @style="color:#CCC;" })),
grid.Column(format: (item) => Html.ActionLink("Edit", "Edit", new { EmployeeID = item.JobNumber }))
));
这是CSS
.webgrid
{
width: 100%;
border: 0px;
border-collapse: collapse;
white-space:nowrap;
}
.des {
width:50%;
}
.webgrid a
{
color: #000;
}
.webgrid-header
{
padding: 6px 5px;
text-align: center;
background-color: #e8eef4;
border-bottom: 2px solid #3966A2;
height: 40px;
border-top: 2px solid #D6E8FF;
border-left: 2px solid #D6E8FF;
border-right: 2px solid #D6E8FF;
}
.webgrid-footer
{
padding: 6px 5px;
text-align: center;
background-color: #e8eef4;
border-top: 2px solid #3966A2;
height: 30px;
border-bottom: 2px solid #D6E8FF;
border-left: 2px solid #D6E8FF;
border-right: 2px solid #D6E8FF;
}
.webgrid-alternating-row
{
height: 30px;
background-color: #f2f2f2;
border-bottom: 1px solid #d2d2d2;
border-left: 2px solid #D6E8FF;
border-right: 2px solid #D6E8FF;
}