2013-11-21 22 views
3

我有WEBGRID有9列,在這我需要text-align Right爲Money字段和text-align center爲其他字段。當我嘗試對齊列時,它被對齊,並且header沒有正確對齊,如何根據列對齊來對齊特定Column的標頭。asp.net mvc如何在網格上對齊標題mvc

<div id="gridContent"> 
    @grid.GetHtml(
    tableStyle: "webgrid-table", 
    headerStyle: "webgrid-header", 
    footerStyle: "webgrid-footer", 
    alternatingRowStyle: "webgrid-alternating-row", 
    selectedRowStyle: "webgrid-selected-row", 
    rowStyle: "webgrid-row-style", 
     columns: grid.Columns(
          grid.Column("Cust_Name", "Customer Name", style:"Custname"), 
          grid.Column("SalesDatestr", "Sales Date",style: "name"), 
          grid.Column("TotalAmount", "Total Amount", style:"Curency"), 
          grid.Column("Pay_Amount", "Paid Amount", style:" width: 64px; text-align: right; margin-right: 174px; border-right-style: solid; border-right-width: 29px; "), 
          grid.Column("Pay_Mode", "Paid Mode", style: "name"), 
          grid.Column("Bank_Name", "Bank Name", style: "name"), 
          grid.Column("Bank_Address", "Bank Address", style: "name"), 
          grid.Column("ChequeNo", "ChequeNo", style: "name"), 
          grid.Column("Cheque_Datestr", "Cheque Date", style: "name")                    
            ) 
           ) 
</div> 

風格:

部首

.webgrid-header td, th 
{ 
    background-color: #72AAD3; /*#D3D3D3; color: #6D70B5;*/ 
    padding-bottom: 4px; 
    padding-top: 5px; 
    text-align: left; 
    border-bottom: 1px solid white; 
    border-top: 1px solid white; 
    margin-bottom: 2px; 
    padding: 0px 5px; 
    text-align: right; 
    height: 22px; 
    color: white; 
    font-weight: bold; 
} 

.Curency 
{ 
text-align: right; 
width: 80px; 
border: rgba(250, 38, 38, 0); 
border-right-style: solid; 
border-right-width: 10px; 

} 

回答

3

應用此:

<style type="text/css"> 
    tr.webgrid-row-style td:nth-child(4) 
    { 
     text-align: right; 
    } 
</style>