将CSS类应用于gridview不起作用
我在HTML中有一个表格结构，我想用适当的CSS类和设计将其转换为Gridview。
但是当我将它转换为我的gridview并应用CSS类时，gridview的boundfield不会使用CSS。请参阅HTML代码和我的gridview。
Gridview的HTML
<table width="100%" border="1" style="border: 1px solid #E5E5E5;" cellpadding="0" cellspacing="0" class="hoverTable">
<tr>
<td class="k-grid td">Page Title</td>
<td class="k-grid td">Page Description</td>
<td class="k-grid td">Meta Keywords</td>
<td class="k-grid td">Meta Description</td>
<td class="k-grid td">Active</td>
<td class="k-grid td">
Action
</td>
</tr>
<tr>
<td class="k-grid td"><input type="text" class="form-control" name="" id="" value="" placeholder="Title"></td>
<td class="k-grid td"><input type="text" class="form-control" name="" id="" value="" placeholder="Description"></td>
<td class="k-grid td"><input type="text" class="form-control" name="" id="" value="" placeholder="Meta Keywords"></td>
<td class="k-grid td"><input type="text" class="form-control" name="" id="" value="" placeholder="Meta Description"></td>
<td class="k-grid td">
<select class="selectpicker form-control-drp wd" style="width: 100%">
<option role="option" value="10">Active</option>
<option role="option" value="20" selected="selected">Inctive</option>
</select>
</td>
<td class="k-grid td">
</td>
</tr>
<tr>
<td class="k-grid ">Page Title</td>
<td class="k-grid ">Page Description</td>
<td class="k-grid ">Meta Keywords</td>
<td class="k-grid">Meta Description</td>
<td class="k-grid">Active</td>
<td class="k-grid" width='7%'>
<a class=" k-button-icontext k-grid-edit" href="#" title="Edit this row"><img src="images/edit.png" class="img-hvr1" width="15" height="15"/></a>
<a class="k-button-icontext k-grid-delete" href="#" title="Delete this row"><img src="images/delete.png" width="15" height="15"/> </a>
</td>
</tr>
<tr class="k-alt ui-state-highlight">
<td class="k-grid ">Page Title</td>
<td class="k-grid ">Page Description</td>
<td class="k-grid ">Meta Keywords</td>
<td class="k-grid">Meta Description</td>
<td class="k-grid">Active</td>
<td class="k-grid">
<a class=" k-button-icontext k-grid-edit" href="#" title="Edit this row"><span><img src="images/edit.png" class="img-hvr1" width="15" height="15"/></span></a>
<a class="k-button-icontext k-grid-delete" href="#" title="Delete this row"><img src="images/delete.png" width="15" height="15"/> </a>
</td>
</tr>
<tr>
<td class="k-grid ">Page Title</td>
<td class="k-grid ">Page Description</td>
<td class="k-grid ">Meta Keywords</td>
<td class="k-grid">Meta Description</td>
<td class="k-grid">Active</td>
<td class="k-grid">
<a class=" k-button-icontext k-grid-edit" href="#" title="Edit this row"><span><img src="images/edit.png" class="img-hvr1" width="15" height="15"/></span></a>
<a class="k-button-icontext k-grid-delete" href="#" title="Delete this row"><img src="images/delete.png" width="15" height="15"/> </a>
</td>
</tr>
<tr class="k-alt">
<td class="k-grid ">Page Title</td>
<td class="k-grid ">Page Description</td>
<td class="k-grid ">Meta Keywords</td>
<td class="k-grid">Meta Description</td>
<td class="k-grid">Active</td>
<td class="k-grid">
<a class=" k-button-icontext k-grid-edit" href="#" title="Edit this row"><span><img src="images/edit.png" class="img-hvr1" width="15" height="15"/></span></a>
<a class="k-button-icontext k-grid-delete" href="#" title="Delete this row"><img src="images/delete.png" width="15" height="15"/> </a>
</td>
</tr>
<tr class="k-grid td">
<td colspan="9" class="k-grid td">
<table width="100%" cellspacing="0" cellpadding="0" border="0" class="hoverTable_tbl">
<tr>
<td>
<table width="100%" cellspacing="0" cellpadding="0" border="0">
<tr>
<td>
<center>
<table width="100%" cellspacing="0" cellpadding="0" border="0">
<tbody><tr>
<td class="txtpara"><button type="button" class="btn btn-default" id="prv-nxt"><<</button> Page <input class="ui-pg-input form-control-page" type="text" size="2" maxlength="7" value="0" role="textbox"> of 5 <button type="button" class="btn btn-default" id="prv-nxt">>></button></td>
<td>
<select class="selectpicker form-control-drp" role="listbox"><option role="option" value="10">10</option><option role="option" value="20" selected="selected">20</option><option role="option" value="30">30</option><option role="option" value="99999">All</option></select></td>
</tr>
</tbody></table>
</center>
</td>
<td>
<table width="100%" cellspacing="0" cellpadding="0" border="0">
<tbody><tr>
<td class="txtpara-right">View 1 - 20 of 88</td>
</tr>
</tbody></table>
</td>
</tr>
</table>
</td>
</tr>
</table>
</td>
</tr>
</table>
当我同样适用于gridview boundfield它不起作用时，伙计们请帮助
在gridview上应用HTML： -
<asp:GridView ID="grdCSRPageData" runat="server" Width="100%" border="1" Style="border: 1px solid #E5E5E5;" CellPadding="3"
AutoGenerateColumns="False" OnDataBound="grdCSRPageData_DataBound" AllowPaging="true" CssClass="hoverTable" EmptyDataText="No Records Found"
OnPageIndexChanging="grdCSRPageData_PageIndexChanging" DataKeyNames="Id" OnRowDeleting="grdCSRPageData_RowDeleting"
PageSize="5" ShowFooter="true" OnRowEditing="grdCSRPageData_RowEditing" OnRowUpdating="grdCSRPageData_RowUpdating"
OnRowCancelingEdit="grdCSRPageData_RowCancelingEdit">
<AlternatingRowStyle CssClass="k-alt" BackColor="#f5f5f5" />
<Columns>
<asp:TemplateField HeaderText="Select" HeaderStyle-Width="5%" HeaderStyle-CssClass="k-grid td">
<ItemTemplate>
<asp:CheckBox ID="chkSelect" runat="server" AutoPostBack="false" />
</ItemTemplate>
</asp:TemplateField>
<asp:BoundField DataField="page_title" HeaderText="Page Title" ItemStyle-Width="30" HeaderStyle-CssClass="k-grid td" />
<asp:BoundField DataField="page_description" HeaderText="Page Description" ItemStyle-Width="30" HeaderStyle-CssClass="k-grid td" />
<asp:BoundField DataField="meta_title" HeaderText="Meta Title" ItemStyle-Width="30" HeaderStyle-CssClass="k-grid td" />
<asp:BoundField DataField="meta_keywords" HeaderText="Meta Keywords" ItemStyle-Width="30" HeaderStyle-CssClass="k-grid td" />
<asp:BoundField DataField="meta_description" HeaderText="Meta Description" ItemStyle-Width="30" HeaderStyle-CssClass="k-grid td" />
<asp:BoundField DataField="Active" HeaderText="Active" ItemStyle-Width="30" HeaderStyle-CssClass="k-grid td" />
<asp:TemplateField HeaderText="Action" HeaderStyle-Width="15%" HeaderStyle-CssClass="k-grid td">
<ItemTemplate>
<asp:ImageButton ID="btnDelete" AlternateText="Delete" ImageUrl="~/images/delete.png" runat="server" Width="15" Height="15" CommandName="Delete" CommandArgument='<%# Eval("Id") %>' CausesValidation="false" OnClientClick="return confirm('Are you sure you want to delete this record?')" />
</ItemTemplate>
</asp:TemplateField>
<asp:CommandField ButtonType="Image" ItemStyle-Width="15" EditImageUrl="~/images/edit.png" ShowEditButton="True" ControlStyle-Width="15" ControlStyle-Height="15" CancelImageUrl="~/images/close.png" UpdateImageUrl="~/images/update.png">
<ControlStyle Height="20px" Width="20px"></ControlStyle>
</asp:CommandField>
</Columns>
</asp:GridView>
查看您的参考图片： -
1）HTML表格gridview： -
2在实际网格视图中转换： -
1 个答案:
答案 0 :(得分：1)
取代 CssClass 属性，只尝试 css 来分配类。
e.g。
<asp:GridView ID="grdCSRPageData" runat="server" class="hoverTable" Width="100%" border="1" Style="border: 1px solid #E5E5E5;" CellPadding="3"
AutoGenerateColumns="False" OnDataBound="grdCSRPageData_DataBound" AllowPaging="true" EmptyDataText="No Records Found"
OnPageIndexChanging="grdCSRPageData_PageIndexChanging" DataKeyNames="Id" OnRowDeleting="grdCSRPageData_RowDeleting"
PageSize="5" ShowFooter="true" OnRowEditing="grdCSRPageData_RowEditing" OnRowUpdating="grdCSRPageData_RowUpdating"
OnRowCancelingEdit="grdCSRPageData_RowCancelingEdit">
</asp:GridView
相关问题
最新问题
- 我写了这段代码，但我无法理解我的错误
- 我无法从一个代码实例的列表中删除 None 值，但我可以在另一个实例中。为什么它适用于一个细分市场而不适用于另一个细分市场？
- 是否有可能使 loadstring 不可能等于打印？卢阿
- java中的random.expovariate()
- Appscript 通过会议在 Google 日历中发送电子邮件和创建活动
- 为什么我的 Onclick 箭头功能在 React 中不起作用？
- 在此代码中是否有使用“this”的替代方法？
- 在 SQL Server 和 PostgreSQL 上查询，我如何从第一个表获得第二个表的可视化
- 每千个数字得到
- 更新了城市边界 KML 文件的来源？