自定义 修改Flex DataGrid的 Header Style

mx|DataGrid.MarketMoversDataGrid
{
	alternating-item-colors:#F1F1F2, #FFFFFF;
	useRollOver: false;
	vertical-grid-line-color:#A7A9AC;
	border-visible:false;
	color: #000000;
	font-weight: bold;
	font-size: 11pt;
	header-background-skin: ClassReference("au.com.tabcorp.neo.common.presentation.skins.MarketMoversDataGridHeaderSkin");
	header-style-name: marketMoversDGHeader;
	vertical-scroll-bar-style-name: dgVScrollBar;
/*	gradient-color1:#627090;
	gradient-color2:#434d67;*/
}
.marketMoversDGHeader{
	color: #000000;
	font-weight: bold;
	font-size: 11pt;
}

 

<mx:DataGrid id="dg" width="{marketMoversPM.PANEL_WIDTH}" wordWrap="true" rowHeight="30" verticalScrollPolicy="off"
				 styleName="MarketMoversDataGrid" height="100%" headerHeight="40" rowCount="{marketMoversPM.model.gridFlattenData.length}"
				 draggableColumns="false" resizableColumns="false">
		<mx:columns>
			<mx:DataGridColumn id="column_1" width="{SMALL_COLUMN_WIDTH}" sortable="true" headerRenderer="au.com.tabcorp.neo.racing.marketmovers.presentation.MarketMoverDataGridHeader" 
							   headerText="No."  dataField="runnerNumber">
				<mx:itemRenderer>
					<fx:Component>
						<mx:Box	width="30" height="100%" verticalAlign="middle" verticalScrollPolicy="off" horizontalScrollPolicy="off" buttonMode="true" useHandCursor="true" mouseChildren="false">
							<mx:Label text="{data.runnerNumber}" width="100%"  height="15" textAlign="center"  buttonMode="true" useHandCursor="true" mouseChildren="false" />
						</mx:Box>
					</fx:Component>
				</mx:itemRenderer>
			</mx:DataGridColumn>