Question

我有一个包含这两个id选择器的现有CSS文件：

#TableHead {
font-family: Arial, Helvetica, sans-serif;
font-size:11px;
font-weight: bold;
color: #000000;
border-top-width: thin;
border-top-style: solid;
border-top-color: #A9AAAA;
border-bottom-width: thin;
border-bottom-style: solid;
border-bottom-color: #A9AAAA;
}

#TableDivs {
border-bottom-width: 1px;
font-size:11px;
border-bottom-style: dotted;
font-family:Arial, Helvetica, sans-serif;
border-bottom-color: #A9AAAA;
}

我需要使用“TableHead”来设置Gridview标题的样式，并使用“TableDivs”来设置Gridview控件的其余部分。我可以通过将gridview包含在section中来使用TableDivs。如何使用TableHead来设置标题样式？我应该在哪里指定id =“TableHead”？

添加后Gridview的渲染源代码为：

<div id="TableDivs">
  <div>
    <table cellspacing="0" rules="all" border="0" id="ctl00_Main_GridView1" style="border-width:0px;font-weight:normal;border-collapse:collapse;">
      <tr>
      <th align="left" scope="col">
          <a href="javascript:__doPostBack('ctl00$Main$GridView1','Sort$FileName')">File Name</a>
        </th>
        <th align="left" scope="col"><a href="javascript:__doPostBack('ctl00$Main$GridView1','Sort$Description')">Description</a>
        </th>
        <th align="left" scope="col"><a href="javascript:__doPostBack('ctl00$Main$GridView1','Sort$GroupName')">Folder Name</a>
        </th>
        <th align="left" scope="col">
          <a href="javascript:__doPostBack('ctl00$Main$GridView1','Sort$TimeAdded')">Date Added</a>
        </th>
    </tr>
      <tr>
      <td style="width:30%;">
          <a id="ctl00_Main_GridView1_ctl02_btnDownload" href="javascript:__doPostBack('ctl00$Main$GridView1$ctl02$btnDownload','')">2.txt</a>
        </td>
        <td style="width:40%;">222222</td><td style="width:25%;">group11</td>
        <td style="width:5%;">
          <span id="ctl00_Main_GridView1_ctl02_lblDateAdded"></span>
        </td>
    </tr>
      <tr>
      ...
    </tr>
    </table>
  </div>
</div>

Answer 1

<asp:GridView HeaderStyle-CssClass="your_class" ></asp:GridView>

Answer 2

理想情况下应该使用

Gridview .table, Gridview .th, Gridview .tr, Gridview .tr

选择器。这将帮助您选择gridview或所有类似的网格视图，并为它们提供一个共同的外观。

它还允许CSS进行样式设计，而不是在.NET中编写代码并指定类。

Answer 3

<asp:GridView ID="gridId" runat="server" >
    <HeaderStyle CssClass="TableHead" />
    <RowStyle CssClass="TableDivs" />
</asp:GridView>

Answer 4

<asp:GridView ID="TableDivs" runat="server" >
    use some js to get the parent of ths or just thead(if GridView can export thead), then add #TableHead to the element.
</asp:GridView>

Answer 5

感谢大家的帮助。最后我别无选择，只能修改所有的css文件并添加新的类选择器，因为我无法使用id选择器。我在GridView的HeaderStyle，RowStyle，PagerStyle cssclass属性中使用了新的类选择器。现在工作正常。

使用CSS id选择器设置Gridview控件的样式

5 个答案: