2016-01-18 14 views
-2

不同colurs如何使GridView的標題前景色白色和標題列分隔符應該有黑顏色的GridView標題爲separatpor應該在GridView控件

<asp:GridView ID="GVProformainvoice" runat="server" AutoGenerateColumns="false" Width="701px" HeaderStyle-BackColor="#3B4E87" HeaderStyle-BorderColor="Black" HeaderStyle-BorderWidth="2px"> 
      <HeaderStyle BorderColor="black" ForeColor="white"/> 
+0

JavaScript可以幫助你做到這一點 –

+1

你能告訴我該怎麼做..任何想法? –

+0

順便說一句css也可以做同樣的問題 –

回答

0

大家好,我的例子是前端解決方案colur和標題列,這是一個非常簡單的示例給你,希望它是你想要的,通過使用javascript與css

PS:順便說一句,其實你可以添加CSS到你的gridview,它是更簡單的方法來處理你的問題與前端。檢查GridView group rows and change color,如果你想使用後端解決方案。

<html> 
<head> 
    <meta http-equiv="Content-Type" content="text/html; charset=gb3212"> 
    <title></title> 

    <script type="text/javascript"> 
       window.onload = function color(){ 
       var table = document.getElementById("person"); 
       var rows = table.getElementsByTagName("tr"); 
       for(var i = 0; i < rows.length; i++){ 
        if(i % 2 == 0){ 
         rows[i].style.backgroundColor = "#EAF2D3"; 
        } 
        else{ 
         rows[i].style.backgroundColor = "White"; 
        } 
       } 
      } 
    </script> 

    <style type="text/css"> 
     #person { 
      border-style: 1px solid; 
      border-color: blue; 
      font-weight: bold; 
      font-family: Arial, Helvetica, sans-serif; 
      border-collapse: collapse; 
      margin: auto; 
     } 

      #person th { 
       border: 1px solid; 
       padding: 3px 7px 2px 7px; 
       background-color: #A7C942; 
       color: #ffffff; 
       text-align: center; 
      } 

      #person td { 
       border-style: solid; 
       border-width: 1px; 
       text-align: center; 
      } 
    </style> 
</head> 
<body> 
    <table id="person" align="center" width="90%" height="200"> 
     <tr> 
      <th>name</th> 
      <th>phone</th> 
     </tr> 
     <tr> 
      <td>aa</td>    
      <td>33333333</td> 

     </tr> 
     <tr> 
      <td>bb</td>    
      <td>44444444</td>    
     </tr> 
     <tr> 
      <td>cc</td>    
      <td>55555555</td>     
     </tr> 
     <tr> 
      <td>dd</td> 
      <td>66666666</td>     
     </tr> 
    </table> 
</body> 
</html> 



Only CSS  

<table class="myTable"> 
    <tbody> 
     <tr><td>aa</td><td>aa</td></tr> 
     <tr><td>bb</td><td>bb</td></tr> 
     <tr><td>cc</td><td>cc</td></tr> 
     <tr><td>dd</td><td>dd</td></tr> 
     <tr><td>ee</td><td>ee</td></tr> 
    </tbody> 
</table> 

<style> 
    .myTable { 
     border: 1px solid black; 
    } 

     .myTable tr:nth-child(even) { 
      background: #CCC; 
     } 

     .myTable tr:nth-child(odd) { 
      background: #FFF; 
     } 
</style> 
+1

但是即時通訊使用gridview,而不是一般表 –

+0

綁定datatable到GridView –

+0

@krishnamohan如果你想用後端來處理您的問題,請檢查此URL http://stackoverflow.com/questions/24933651/gridview-group-rows-and-change-color –