小小菜鸟的web菜园子

web开发学习。好记性不如烂笔头。每天进步一点点!

导航

在FLEX的TextArea组件中使用CSS.

<?xml version="1.0" encoding="utf-8"?>
<!-- http://blog.flexexamples.com/2008/03/22/applying-a-cascading-style-sheet-to-a-textarea-control-in-flex/ -->
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml"
        layout
="vertical"
        verticalAlign
="middle"
        backgroundColor
="white"
        creationComplete
="init();">

    
<mx:Script>
        
<![CDATA[
            import mx.controls.Alert;

            private var styleSheet:StyleSheet;
            private var urlLoader:URLLoader;

            private function init():void {
                urlLoader = new URLLoader();
                urlLoader.addEventListener(Event.COMPLETE, urlLoader_complete);
                urlLoader.load(new URLRequest("styles.css"));
            }

            private function urlLoader_complete(evt:Event):void {
                var css:String = URLLoader(evt.currentTarget).data;
                // Convert text to style sheet.
                styleSheet = new StyleSheet();
                styleSheet.parseCSS(css);
                // Set the style sheet.
                textArea.styleSheet = styleSheet;
            }

            private function textArea_link(evt:TextEvent):void {
                Alert.show("text: " + evt.text, "Panel");
            }
        
]]>
    
</mx:Script>

    
<mx:String id="txt" source="text.html" />

    
<mx:TextArea id="textArea"
            htmlText
="{txt}"
            editable
="false"
            condenseWhite
="true"
            width
="100%"
            height
="100%"
            link
="textArea_link(event);" />

</mx:Application>
/src/styles.css
h1 {
    font-size
: 24;
}

{
    font-size
: 10;
}

{
    text-decoration
: underline;
}

a:hover 
{
    color
: #FF0000;
}

来自:http://blog.flexexamples.com/2008/03/22/applying-a-cascading-style-sheet-to-a-textarea-control-in-flex/

posted on 2008-03-30 19:18  『小小菜鸟』  阅读(1571)  评论(0编辑  收藏  举报