使用CSS id選擇樣式GridView控件

我有這2個ID選擇現有的CSS文件：使用CSS id選擇樣式GridView控件

#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來使用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>

來源

2011-07-05 KhD

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

來源

2011-07-05 09:00:20

我試過這個，但它不起作用。這隻會在我使用css類選擇器時才起作用。但在我的情況下，我必須使用CSS ID選擇器。 – KhD

理論上，應該使用

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

選擇。這將幫助您選擇gridview或所有類似的gridviews，併爲它們提供一個共同的外觀和感覺。

它也允許CSS做樣式，而不是在.NET中編寫代碼並指定類。

來源

2011-07-05 09:04:50 sandyiit

理想情況下，應該這樣做。但我正在開發的頁面是對現有網站的補充，並且所有頁面都通用了css文件。所以，我無法更改css文件。 – KhD

從你正在使用Ids的註釋看來：所以你設置了GridView Id，但是你不能設置表頭或表的ID，你將不得不使用css類或者更新css文件 – sandyiit

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

來源

2011-07-05 09:04:59

我試過了，但它不起作用。這隻會在我使用css類選擇器時才起作用。但在我的情況下，我必須使用CSS ID選擇器。 – KhD

這是一個CSS的東西，並沒有任何關係網格。更改您的CSS選擇器以定位網格。你可以給我們你的網格渲染結果（樣本） –

在問題結尾添加。 – KhD

<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>

來源

2011-07-05 09:38:03 avajayam

我不明白。如果我將Gridview ID更改爲「TableDivs」，那麼我必須在我的代碼中隨處更改它。這是個好主意嗎？ – KhD

也許可以使用javascript來獲取tbody並添加#TableDivs。但是一個id只能在文檔中使用一次，如果#TableDivs將無處不在，可能需要更改css。 – avajayam

感謝大家的幫助。最後，我別無選擇，只能修改所有的CSS文件並添加新的類選擇器，因爲我沒有辦法使用ID選擇器。我在GridView的HeaderStyle，RowStyle，PagerStyle cssclass屬性中使用了新的類選擇器。現在工作正常。

來源

2011-07-07 04:25:36 KhD

使用CSS id選擇樣式GridView控件

回答

相關問題