<? xml version="1.0" encoding="utf-8" ?>

<!--  http://blog.flexexamples.com/2007/10/30/setting-styles-on-individual-flex-accordion-headers/  -->

< mx:Application  xmlns:mx ="http://www.adobe.com/2006/mxml"

        layout ="vertical"

        verticalAlign ="middle"

        backgroundColor ="white" >

     < mx:Style >

        AccordionHeader {

            fillColors: black, black;

            fillAlphas: 1, 1;

            textRollOverColor: white;

            textSelectedColor: white;

            themeColor: black;

        }

     </ mx:Style >

     < mx:Script >

         <![CDATA[

            private function init():void {

                accordion.getHeaderAt(0).setStyle("color", "red");

                accordion.getHeaderAt(1).setStyle("color", "haloOrange");

                accordion.getHeaderAt(2).setStyle("color", "yellow");

                accordion.getHeaderAt(3).setStyle("color", "haloGreen");

                accordion.getHeaderAt(4).setStyle("color", "haloBlue");

            }

         ]]>

     </ mx:Script >

     < mx:Accordion  id ="accordion"

            width ="300"

            height ="200"

            creationComplete ="init();" >

         < mx:VBox  label ="Red"   />

         < mx:VBox  label ="Orange"   />

         < mx:VBox  label ="Yellow"   />

         < mx:VBox  label ="Green"   />

         < mx:VBox  label ="Blue"   />

     </ mx:Accordion >

</ mx:Application >