Open the Actions panel (Window > Development Panels > Actions) and add the following code
9
to the Actions panel:
// Create a new style sheet object
var style_sheet = new TextField.StyleSheet();
// Location of CSS file that defines styles
var css_url = "html_styles.css";
// Create some HTML text to display
var storyText:String = "<p class='headline'>Flash Player now supports
Cascading Style Sheets!</p><p><span class='byline'>San Francisco, CA</
span>--Macromedia Inc. announced today a new version of Flash Player that
supports Cascading Style Sheet (CSS) text styles. For more information,
visit the <a href='http://www.macromedia.com'>Macromedia Flash web site.</
a></p>";
// Load CSS file and define onLoad handler:
style_sheet.load(css_url);
style_sheet.onLoad = function(ok) {
if (ok) {
// If the style sheet loaded without error,
// then assign it to the text object,
// and assign the HTML text to the text field.
news_txt.styleSheet = style_sheet;
news_txt.text = storyText;
}
};
Note: For simplicity, the HTML text being styled is "hard-coded" into the script; in a real-world
application you'll probably want to load the text from an external file. For information on loading
external data, see
Save the file as news_html.fla to the same directory that contains the CSS file you
10
created previously.
Run the movie (Control > Test Movie) to see the styles applied to the HTML
11
text automatically.
Using styles to define new tags
If you define a new style in a style sheet, that style can be used as a tag, just as you would use a
built-in HTML tag. For example, if a style sheet defines a CSS style named
you can use
<sectionHeading>
This feature lets you assign arbitrary XML-formatted text directly to a text field, so that the text
will be automatically formatted using the rules in the style sheet.
For example, the following style sheet creates the new styles
and
emphasized
sectionHeading {
font-family: Verdana, Arial, Helvetica, sans-serif;
font-size: 18px; display: block
}
mainBody {
color: #000099;
text-decoration: underline;
font-size: 12px; display: block
}
emphasized {
font-weight: bold; display: inline
}
Chapter 10, "Working with External Data," on page
as an element in any text field associated with the style sheet.
.
177.
sectionHeading
Formatting text with Cascading Style Sheets
,
sectionHeading
,
,
mainBody
145
Need help?
Do you have a question about the FLASH MX 2004 - ACTIONSCRIPT and is the answer not in the manual?
Questions and answers