Setting styles for specific components

You can create custom style declarations to specify a unique set of properties for specific components in your Flash document. You create a new instance of the CSSStyleDeclaration object, create a custom style name and place it on the _global.styles list (_global.styles.newStyle), specify the properties and values for the style, and assign the style to an instance. The CSSStyleDeclaration object is accessible if you have placed at least one component instance on the Stage.

You make changes to a custom style format in the same way that you edit the properties in the _global style declaration. Instead of the _global style declaration name, use the CSSStyleDeclaration instance. For more information on the _global style declaration, see Setting global styles.

For information about the properties of the CSSStyleDeclaration object, see Supported styles. For a list of which styles each component supports, see their individual entries in Components Dictionary.

To create a custom style declaration for specific components:

Make sure the document contains at least one component instance.
For more information, see Adding components to Flash documents.

This example uses three button components with the instance names a, b, and c. If you use different components, give them instance names in the Property inspector and use those instance names in step 9.
Create a new layer in the Timeline and give it a name.
Select a frame in the new layer on which (or before) the component appears.
Open the Actions panel in expert mode.
Use the following syntax to create an instance of the CSSStyleDeclaration object to define the new custom style format:
```
var styleObj = new mx.styles.CSSStyleDeclaration;
```
Set the styleName property of the style declaration to name the style:
```
styleObj.styleName = "newStyle"; 
```
Place the style on the global style list:
```
_global.styles.newStyle = styleObj; 
```
Note: You can also create a CSSStyleDeclaration object and assign it to a new style declaration by using the following syntax:
```
var styleObj = _global.styles.newStyle = new mx.styles.CSSStyleDeclaration();
```

Use the following syntax to specify the properties you want to define for the myStyle style declaration:

styleObj.fontFamily = "_sans";
styleObj.fontSize = 14;
styleObj.fontWeight = "bold";
styleObj.textDecoration = "underline";
styleObj.color = 0x336699;
styleObj.setStyle("themeColor", "haloBlue");

In the same Script pane, use the following syntax to set the styleName property of two specific components to the custom style declaration:
```
a.setStyle("styleName", "newStyle");
b.setStyle("styleName", "newStyle");
```

You can also access styles on a custom style declaration using the setStyle() and getStyle() methods. The following code sets the backgroundColor style on the newStyle style declaration:

_global.styles.newStyle.setStyle("backgroundColor", "0xFFCCFF");