查看完整版本: FLEX实现的背景

dreamfly 2007-12-5 11:24

FLEX实现的背景

[url=http://www.websector.de/blog/wp-content/uploads/2007/07/06/WSBackgroundPixelSkinExample.html][img]http://www.websector.de/blog/wp-content/uploads/2007/07/06/screenShotWSGPixelSkin.png[/img][/url]

     你一看，肯定会说，这有什么啊,不就是背景用CSS来连接加载嘛.但是...嘿嘿,我会发这么小儿科的东西吗?这里最牛的就是里面没用到一张图片，只是用代码,全是这样的代码:

1110111110111110111311101111101111101113",
1101111211010112111101011211112321111211",
"1010200112110020101110221110313011122011",
"0112011301031102110101111131131131111101",
"1120112110112110211111111201010102111111",
"1110120111110210111111113021111120311111",
"1111311310131141111111121110121011121111",
"1101011131311101011111231311323113132111",
"1012101011101015101112013112212211310211",
"1101011131311101011111231311323113132111",
"1111311310131131111111121110121011121111",
"1110120111110210111111113021111120311111",
"1120112110112110211111111201010102111111",

jonewin 2007-12-5 11:53

额。这是怎么弄的？  不是很懂。。。
请教请教。。。

dreamfly 2007-12-5 22:19

它的表现层是用flex实现的。


主要是由以下两个文件实现：

WSBackgroundPixelSkinExample.mxml 源码：[code]
<?xml version="1.0" encoding="utf-8"?>
<!--
* Pimp your Flex app using WSBackgroundPixelSkin [whithout images - pure CSS and AS]
*
* @author Jens Krause [www.websector.de]
* @date  07/06/07
* @see  http://www.websector.de/blog/2007/07/06/pimp-your-flex-app-using-wsbackgroundpixelskin/
*
* Feel free to use the source - its licensed under the Mozilla Public License 1.1. (http://www.mozilla.org/MPL/MPL-1.1.html)
-->
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml"
width="100%" height="100%"
backgroundColor="0x000000"
styleName="bg7"
preloader="Preloader"
creationComplete="onAppComplete(event)"
viewSourceURL="srcview/index.html">
<mx:Style source="css/styles.css"/>
<mx:Script>
  <![CDATA[
   import mx.events.FlexEvent;
  
   [Bindable]
            private var _stylesData: Array;
  
   private var _maxStyles: uint = 10;
   
   private function onAppComplete(event: FlexEvent): void
   {
    _stylesData = new Array();
   
    for (var i: uint = 0; i < _maxStyles; i++)
    {
     _stylesData[i] = {label:"Pixel Style " + (i + 1), data: i};
    }
   
    styleApp.dataProvider
    = styleCBox1.dataProvider
    = styleCBox2.dataProvider
    = _stylesData;
   
    styleApp.selectedIndex = 8;
    styleCBox1.selectedIndex = 0;
    styleCBox2.selectedIndex = 4;      
   }
   
   private function changeBGStyles(event: Event):void
   {
    var styleId: uint = event.target.value;
   
    switch(event.target)
    {
     case styleApp:
      this.styleName = "bg" + styleId;
     break;     
     case styleCBox1:
      cBox1.styleName = "bg" + styleId;      
     break;     
     case styleCBox2:
      cBox2.styleName = "bg" + styleId;
     break;     
     default:
     
    }
   }
   
   private function gotoWSBlog( ):void
            {
              var url:URLRequest = new URLRequest( "http://www.websector.de/blog/2007/07/06/pimp-your-flex-app-using-wsbackgroundpixelskin/" );
                navigateToURL(url);
            }
  ]]>
</mx:Script>
  
<mx:VBox id="vBox"
  height="100%" width="100%"
  horizontalAlign="center"
  verticalGap="50">
  <mx:VBox
   horizontalAlign="center"
   backgroundColor="0">
   <mx:LinkButton
    label="Pimp your Flex app using WSBackgroundPixelSkin"
    click="gotoWSBlog()"/>
   <mx:Text text="* without images - pure CSS and AS *"
    fontSize="15" color="#FFFFFF"/>
   
  </mx:VBox>
   
  <mx:Form>
   <mx:Text text="App background"
    styleName="formH1" />
   <mx:ComboBox id="styleApp"
    width="100%"
    dataProvider="{_stylesData}"
    change="changeBGStyles(event)"
    selectedIndex="0">
   
   </mx:ComboBox>
  </mx:Form>
  <!-- canvas example-->
  <mx:HBox id="hBox"
   width="90%" height="300"
   borderStyle="solid" borderThickness="10" borderColor="0xFFFFFF"
   backgroundColor="0xFFFFFF"
   horizontalAlign="center" verticalAlign="middle">

   <mx:Canvas id="cBox1"
    styleName="bg0"
    width="50%" height="100%">
    <mx:Form
     horizontalCenter="0" verticalCenter="0">
     <mx:Text text="Left Canvas background"
      styleName="formH1" />
     <mx:ComboBox id="styleCBox1"
      width="100%"
      change="changeBGStyles(event)"
      selectedIndex="1">
      
     </mx:ComboBox>
    </mx:Form>   
   </mx:Canvas>
   
   <mx:Spacer width="10" />

   <mx:Canvas id="cBox2"
    styleName="bg4"
    width="50%" height="100%">
    <mx:Form
     horizontalCenter="0" verticalCenter="0">
     <mx:Text text="Right Canvas background"
      styleName="formH1" />
     <mx:ComboBox id="styleCBox2"
      width="100%"
      dataProvider="{_stylesData}"
      change="changeBGStyles(event)"
      selectedIndex="2">      
     </mx:ComboBox>
    </mx:Form>
   </mx:Canvas>
     
  </mx:HBox>  
</mx:VBox>
     
</mx:Application>[/code]

styles.css 中主要代码：

[size=1][color=blue]    "00010000101000000000",
    "00100001000100001000",
    "01000010000010000100",
    "10000100000001000010",
    "01001000000000100100",
    "00110000010000011000",
    "00100000000000001000",
    "00000100111001000000",
    "00100000000000001000",
    "00000001010100000000",
    "00100000101000000000",
    "00100000010000001000",
    "00010000000000010000",
    "00001001010100100000",
    "00001000010000100001",
    "10010000101000010010",
    "01100001000100001100",
    "00000010010010000000",
    "00000100000001000000",
    "00001000010000100000",
    "00001000000000100000",
    "00010000010000010000",
    "01100000000000001100",
    "00000000010000000000";[/color][/size]
[size=1][color=blue][/color][/size]
[size=1][color=blue]    "0101011111111101010201010111111111010102",
    "1110111110111110111311101111101111101113",
    "0111121101011211110101121111232111121101",
    "1010200112110020101110221110313011122011",
    "0112011301031102110101111131131131111101",
    "1120112110112110211111111201010102111111",
    "1110120111110210111111113021111120311111",
    "1111311310131141111111121110121011121111",
    "1101011131311101011111231311323113132111",
    "1012101011101015101112013112212211310211",
    "1101011131311101011111231311323113132111",
    "1111311310131131111111121110121011121111",
    "1110120111110210111111113021111120311111",
    "1120112110112110211111111201010102111111",
    "0112011301031102110101111131131131111101",
    "1010200112110020101110221110313011122011",
    "0111121101011211110101121111232111121101",
    "1110111110111110111311101111101111101113",
    "0101011111111101010201010111111111010102",
    "2311111111111111132123111111111111111321",
    "0101011111111101010201010111111111010102",
    "1110111110111110111311101111101111101113",
    "0112111123211112110101111211010112111101",
    "1022111031301112201110102001121100201011",
    "0111113113113111110101120113010311021101",
    "1111120101010211111111201121101121102111",
    "1111302111112031111111101201111102101111",
    "1112111012101112111111113113101311311111",
    "1123131132311313211111010111313111010111",
    "1201311221221131021110121010111010121011",
    "1123131132311313211111010111313111010111",
    "1112111012101112111111113113101311311111",
    "1111302111112031111111101201111102101111",
    "1111120101010211111111201121101121102111",
    "0111113113113111110101120113010311021101",
    "1022111031301112201110102001121100201011",
    "0112111123211112110101111211010112111101",
    "1110111110111110111311101111101111101113",
    "0101011111111101010201010111111111010102",
    "2311111111111111132123111111111111111321";
[/color][/size]
[size=1][color=blue][/color][/size]
[size=1][color=blue]    "011111112332442333324424423333244233211111110",
    "101111112332444233244424442332444233211111101",
    "110111111233244422444232444224442332111111011",
    "111011111123324444442333244444423321111110111",
    "111101111112332444423323324444233211111101111",
    "111110111111233222233212332222332111111011111",
    "111111011111123333332111233333321111110111111",
    "111111101111112333321111123333211111101111111",
    "221111110111111222211111112222111111011111122",
    "332111111011111111111111111111111110111111233",
    "333211111101111111111111111111111101111112333",
    "223321111110111111111111111111111011111123322",
    "442332111111011111111111111111110111111233244",
    "444233211111101111111111111111101111112332444",
    "244423321111110111111111111111011111123324442",
    "324442332111111011111111111110111111233244423",
    "332442332111111101111121111101111111233244233",
    "332442332111111110111232111011111111233244233",
    "324442332111111111012333210111111111233244423",
    "244423321111111111112333211111111111123324442",
    "444233211111111111223333322111111111112332444",
    "442332111111111112333323333211111111111233244",
    "223321111111111123333242333321111111111123322",
    "442332111111111112333323333211111111111233244",
    "444233211111111111223333322111111111112332444",
    "244423321111111111112333211111111111123324442",
    "324442332111111111012333210111111111233244423",
    "332442332111111110111232111011111111233244233",
    "332442332111111101111121111101111111233244233",
    "324442332111111011111111111110111111233244423",
    "244423321111110111111111111111011111123324442",
    "444233211111101111111111111111101111112332444",
    "442332111111011111111111111111110111111233244",
    "223321111110111111111111111111111011111123322",
    "333211111101111111111111111111111101111112333",
    "332111111011111111111111111111111110111111233",
    "221111110111111222211111112222111111011111122",
    "111111101111112333321111123333211111101111111",
    "111111011111123333332111233333321111110111111",
    "111110111111233222233212332222332111111011111",
    "111101111112332444423323324444233211111101111",
    "111011111123324444442333244444423321111110111",
    "110111111233244422444232444224442332111111011",
    "101111112332444233244424442332444233211111101",
    "011111112332442333324424423333244233211111110";[/color][/size]
[size=1][color=blue][/color][/size]
[size=1][color=blue]    "00000011100000000000000000000020200000002020000111111000000000000",
    "00000100010000202000000000000202020000020202001000000110000000000",
    "00001011101002020200000000000020200000002020010011111001000000000",
    "00000100010100202000011111000002000202000200101100000110100000000",
    "00000000010100020001100000110000002000200001000010030001010001000",
    "00000011101000000010011111001000020202020001011101003001010010100",
    "00001100010000000101100000110100000020000010100010100300101001010",
    "00010011100100001010000000001010020202020010103010103030101001010",
    "00101100001010001010003030001010002000200010100010100000101001010",
    "01010003010100010100030003000101000202000101000101001110010110100",
    "01010030010100010100303030300101000000000101000010010001001001000",
    "10100303010100010100000300030010110000011010030000101110100110000",
    "10103000001011100100303030303001004444400100303001010001000000000",
    "10100011100100010100030003000000440000044003030301010000000002000",
    "10100100010011101010003030000004004444400400303001010000000020200",
    "10101011101000001010000000010040440000044040030000101110000202000",
    "10010100010003000101100001101404000000000404000011000001100020200",
    "01010103000030300010011110010404000303000404000100111110010002000",
    "00100100000303030001100001104040003000300040401011000001101000000",
    "00010011100030300044444110004040030303030040410100000000010100000",
    "02001100011003004400000440004040000030000040410100030300010100000",
    "20200011100100040044444004004040030303030040401000300030001010000",
    "02020000011010404400000440400404003000300040401003030303001010000",
    "20200000000104040000000004040404000303000404101000003000001010000",
    "02000202000104040003030004040040400000000404101003030303001010000",
    "00002000200040400030003000404004040000044040010100300030001010000",
    "00020202020040400303030300404004040004400400010100030300010100000",
    "00000020000040400000300000040440400040044000001010003000010100000",
    "00020202020040400303030300004004000404400044440100030001101000000",
    "00002000200040400030003000000440004040004400004400000110010000200",
    "02000202000104040003030004400000304040040044440040001001100002020",
    "20200000000104040000000040040030000404404400004404010110000020200",
    "02020000011010404400004404404000030040040000000040401000000002020",
    "20200001100100040044440040040403000004400030300040401000202000200",
    "02000010011000004400004400040400044000000300030004040002000200000",
    "00000101100030001044440004404000400400003030303004040020202020000",
    "00001010000300010100000440040004044040000003000004040000020000000",
    "00001010003030001010004004400040400404003030303004040020202020000",
    "00010100030003001010040440000040400404000300030004040002000200000",
    "00010100303030300101404000000004040040400030300040401000202000200",
    "00010100000300000101404000303000404040400000000040401000000002020",
    "00010100303030300104040003000300404004044000004404010110000020200",
    "00010100030003000104040030303030040400400444440040001001110002020",
    "00001010003030001014040000030000040400044000004400300110001100200",
    "00001010000000001014040030303030040400011444440003030001110010000",
    "00000101100000110104040003000300040401100001100030303000001001000",
    "00200010011111001000404000303000404010011110010003030000301010100",
    "02020001100000110000404000000000404101100001101000300010001010010",
    "00202000011101000030040440000044040010000000010100000101110101010",
    "02020000000010100303004004444400400000030300010101110010001001010",
    "00200000000010103030300440000044000000300030001010001001110001010",
    "00000000100010100303001004444400100303030303001001110100000301010",
    "00011001011101000030010110000011010030003000001010001010303001010",
    "00100100100010010000101000000000101003030303001010001010030010100",
    "01011010011100101000101000202000101000300030001010001010300010100",
    "10100101000001010001010002000200010100030300010100010100001101000",
    "10100101030301010301010020202020010100000000010100001001110010000",
    "10100101003001010001010000020000001011000001101000000010001100000",
    "01010010100300101110100020202020000100111110010000000101110000000",
    "00100010100030010000100002000200000011000001100020001010000000000",
    "00000001011000001101002000202000200000111110000202001010001000000",
    "00000000100111110010020200000002020000000000002020200101110100000",
    "00000000011000000100202020000020202000000000000202000010001000000",
    "00000000000111111000020200000002020000000000000000000001110000000",
    "00000000000000000000000000000000000000000000000000000000000000000";[/color][/size]
[size=1][color=blue][/color][/size]
[size=1][color=blue]    "011233331114111133333333333333330002222222222222222222222222220020022222222222222222222222222200033333333333333331115411133332110",
    "111233333111133333333333333333303330202222222222222222222222250222052222222222222222222222202033303333333333333333331511333332111",
    "112333313333313333333333333333303330022222222222222222222222550222055222222222222222222222220033303333333333333333313333313333211",
    "223113111333333333333333333333300330022222222222222222222225502222205522222222222222222222220033003333333333333333333333115315322",
    "333103101133133333333333333333333300222222222222222222222225022222220522222222222222222222222003333333333333333333331331101301333",
    "333331110111333333330000000000000002222222222222222222222225022222220522222222222222222222222200000000000000033333333111011533333",
    "333111011411333333300002222500200555522222222222052222222250222222222052222222250222222222225555002005222200003333333154110115333",
    "331101101133333333000222222205020000052222222222205555555502222222222205555555502222222222250000020502222222000333333335101101133",
    "133110110113333330002222222220502222205222222222220000000022222222222220000000022222222222502222205022222222200033333311011011331",
    "113311411133333330022222222222050222222222222225555522222222222222222222222225555522222222222222050222222222220033333331154113311",
    "113331131313333300222222222222205022222222222225005552222222222222222222222255500522222222222220502222222222222003333313135133311",
    "413331133333333302222222222222220222222222222250220552222222222222222222222255022052222222222222022222222222222203333333331133354",
    "113313333333333302222222222222222222222222222250222002222222222222222222222200222052222222222222222222222222222203333333333313315",
    "131333333333333302222222222222222222222222222502222222222222222222222222222222222205222222222222222222222222222203333333333333131",
    "133333333333333302222222222222222222222222222502222222222222222222222222222222222205222222222222222222222222222203333333333333331",
    "133333333333333302202222222222222222222222222502222222222222222222222222222222222205222222222222222222222222202203333333333333331",
    "333333333300000000220222222222222222222222222502222222222222222222222222222222222205222222222222222222222222022000000003333333333",
    "333333330002222200220222222222222222222222222502222222222222222222222222222222222205222222222222222222222222022002222200033333333",
    "333333300022222222005222222222222222222222222502222222222222222222222222222222222205222222222222222222222222500222222220003333333",
    "333333000222222022044422222222222222222222225002222222222222222222222222222222222200522222222222222222222224440220222222000333333",
    "333330002222222200546662222222222222222222225022222222222222222222222222222222222220522222222222222222222266645002222222200033333",
    "333330022222222222246662222222222222222222255022222222222222222222222222222222222220552222222222222222222266642222222222220033333",
    "333330022222222222226632222222222222222222555022222222222222222222222222222222222220555222222222222222222236622222222222220033333",
    "333330222222222222222222222222222222222225550222222222222222222222222222222222222222055522222222222222222222222222222222222033333",
    "333330222222222222222222222222222222222255502222222222222222222222222222222222222222205552222222222222222222222222222222222033333",
    "333330222222222222222222222222222222225555022222222222222222222222222222222222222222220555522222222222222222222222222222222033333",
    "333330222222222222222222220522222225555000222222222222222222222222222222222222222222222000555522222225022222222222222222222033333",
    "333330522222222222222222225052225555550222222222222222222222222222222222222222222222222222055555522250522222222222222222225033333",
    "333330002222222222222222222505550000002222222222222222222222222222222222222222222222222222200000055505222222222222222222200033333",
    "333330050222222222222222222250003333222222222222222222222222222222222222222222222222222222222333300052222222222222222222050033333",
    "333330205022222222222222222250333333777777772222222222222222222222222222222222222222277777777333333052222222222222222220502033333",
    "300030020502222222222222222250333377772222222222222222222222222222222222222222222222222222277773333052222222222222222205020030003",
    "033030002050222222222222222503333377727772222222222222222222222222222222222222222222222277727773333305222222222222222050200030330",
    "033330502202222222222222222503333377722227772222222222222222222222222222222222222222277722227773333305222222222222222202205033330",
    "033300502222222222222222222503377777272222222222222222222222222222222222222222222222222222272777773305222222222222222222205003330",
    "200002502222222222222222225503377777227722222222222222222222222222222222222222222222222227722777773305522222222222222222205200002",
    "220022502222222222222222225502777722722277222222222222222222222222222222222222222222222772227227777205522222222222222222205220022",
    "202222250222222222222222225502772272272222772222222222222222222222222222222222222222277222272272277205522222222222222222052222202",
    "222222225222222222222222255022727227227222222222222222222222222222222222222222222222222222722722727220552222222222222222522222222",
    "222222222222222222222222250222727227222722222222222222222222222222222222222222222222222227222722727222052222222222222222222222222",
    "222222222222222222222222550222727222722272222222222222222222222222222222222222222222222272227222727222055222222222222222222222222",
    "222222222222222222222225550222722722722227222222222222222222222222222222222222222222222722227227227222055522222222222222222222222",
    "222222222222222222222255502222722722272222222222222222222222222222222222222222222222222222272227227222205552222222222222222222222",
    "222222222222222222222555022222722722272222222222222222222222222212222222222222222222222222272227227222220555222222222222222222222",
    "222222222222222222255550222222222222222222222222222222222222222121222222222222222222222222222222222222222055552222222222222222222",
    "222222222252255555500002222222222222222222222233222222222222111222111222222222222332222222222222222222222200005555552252222222222",
    "222222222225500000002222222222222222222222222322322222222221221222122122222222223223222222222222222222222222200000005522222222222",
    "222222222550022222222222222222222222222222222322322222222222221222122222222222223223222222222222222222222222222222220055222222222",
    "222222022502222222222222222222222222222222222233222222222222211212112222222222222332222222222222222222222222222222222205220222222",
    "222222502502222222222222222222222222222222222222222222222222111121111222222222222222222222222222222222222222222222222205205222222",
    "222222250550222222222222222222222222222222222222222222222221111222111122222222222222222222222222222222222222222222222055052222222",
    "222222250555022222222222222222222222222222222222222222222211221121122112222222222222222222222222222222222222222222220555052222222",
    "222222250255022222222222222222222222222222222222222222222112333111333211222222222222222222222222222222222222222222220552052222222",
    "222222250222222222222222222222222222222222222222222222221123233313332321122222222222222222222222222222222222222222222222052222222",
    "222222250222222222222222222222222222222222222222222222221122233333332221122222222222222222222222222222222222222222222222052222222",
    "222222250222222222222222222222222222222222222222222222221111233333332111122222222222222222222222222222222222222222222222052222222",
    "222222250222222222222222222222222222222222222222222221112112223333322211211122222222222222222222222222222222222222222222052222222",
    "222222250222222222222222222222222222222222222222222211111222222333222222111112222222222222222222222222222222222222222222052222222",
    "222222502222222222222222222222222222222222222222222112211222222333222222112211222222222222222222222222222222222222222222205222222",
    "222555022222222222222222222222222222222222222212221123212222223333322222212321122212222222222222222222222222222222222222220555222",
    "225500222222222222222222222222222222222222222122211232222222113333311222222232112221222222222222222222222222222222222222222005522",
    "255022222222222222222222222222222222222222222122111233332222121131121222233332111221222222222222222222222222222222222222222220552",
    "000222222222222222222222222222222222222222222111111533333223312212213322333331111111222222222222222222222222222222222222222222000",
    "022222222222222222222222222222222222222222221222212153333333312222213333333311212222122222222222222222222222222222222222222222220",
    "222222222222222222222222222222222222222222212222122211333333331222133333333112221222212222222222222222222222222222222222222222222",
    "022222222222222222222222222222222222222222221222212113333333352222253333333311212222122222222222222222222222222222222222222222220",
    "000222222222222222222222222222222222222222222111111133333223312212213322333331111111222222222222222222222222222222222222222222000",
    "255022222222222222222222222222222222222222222122111233332222521135121222233332111221222222222222222222222222222222222222222220552",
    "225500222222222222222222222222222222222222222122211232222222113333311222222232112221222222222222222222222222222222222222222005522",
    "222555022222222222222222222222222222222222222212221123212222223333322222212321122212222222222222222222222222222222222222220555222",
    "222222502222222222222222222222222222222222222222222112211222222333222222112211222222222222222222222222222222222222222222205222222",
    "222222250222222222222222222222222222222222222222222211111222222333222222111112222222222222222222222222222222222222222222052222222",
    "222222250222222222222222222222222222222222222222222221112112223333322211211122222222222222222222222222222222222222222222052222222",
    "222222250222222222222222222222222222222222222222222222221111233333332111122222222222222222222222222222222222222222222222052222222",
    "222222250222222222222222222222222222222222222222222222221122233333332221122222222222222222222222222222222222222222222222052222222",
    "222222250222222222222222222222222222222222222222222222221123233313332321122222222222222222222222222222222222222222222222052222222",
    "222222250255022222222222222222222222222222222222222222222112333111333211222222222222222222222222222222222222222222220552052222222",
    "222222250555022222222222222222222222222222222222222222222211221121122112222222222222222222222222222222222222222222220555052222222",
    "222222250550222222222222222222222222222222222222222222222221111222111122222222222222222222222222222222222222222222222055052222222",
    "222222502502222222222222222222222222222222222222222222222222111121111222222222222222222222222222222222222222222222222205205222222",
    "222222022502222222222222222222222222222222222233222222222222211212112222222222222332222222222222222222222222222222222205220222222",
    "222222222550022222222222222222222222222222222322322222222222221222122222222222223223222222222222222222222222222222220055222222222",
    "222222222225500000002222222222222222222222222322322222222221221222122122222222223223222222222222222222222222200000005522222222222",
    "222222222252255555500002222222222222222222222233222222222222111222111222222222222332222222222222222222222200005555552252222222222",
    "222222222222222222255550222222222222222222222222222222222222222121222222222222222222222222222222222222222055552222222222222222222",
    "222222222222222222222555022222722722272222222222222222222222222212222222222222222222222222272227227222220555222222222222222222222",
    "222222222222222222222255502222722722272222222222222222222222222222222222222222222222222222272227227222205552222222222222222222222",
    "222222222222222222222225550222722722722227222222222222222222222222222222222222222222222722227227227222055522222222222222222222222",
    "222222222222222222222222550222727222722272222222222222222222222222222222222222222222222272227222727222055222222222222222222222222",
    "222222222222222222222222250222727227222722222222222222222222222222222222222222222222222227222722727222052222222222222222222222222",
    "222222225222222222222222255022727227227222222222222222222222222222222222222222222222222222722722727220552222222222222222522222222",
    "202222250222222222222222225502772272272222772222222222222222222222222222222222222222277222272272277205522222222222222222052222202",
    "220022502222222222222222225502777722722277222222222222222222222222222222222222222222222772227227777205522222222222222222205220022",
    "200002502222222222222222225503377777227722222222222222222222222222222222222222222222222227722777773305522222222222222222205200002",
    "033300502222222222222222222503377777272222222222222222222222222222222222222222222222222222272777773305222222222222222222205003330",
    "033330502202222222222222222503333377722227772222222222222222222222222222222222222222277722227773333305222222222222222202205033330",
    "033030002050222222222222222503333377727772222222222222222222222222222222222222222222222277727773333305222222222222222050200030330",
    "300030020502222222222222222250333377772222222222222222222222222222222222222222222222222222277773333052222222222222222205020030003",
    "333330205022222222222222222250333333777777772222222222222222222222222222222222222222277777777333333052222222222222222220502033333",
    "333330050222222222222222222250003333222222222222222222222222222222222222222222222222222222222333300052222222222222222222050033333",
    "333330002222222222222222222505550000002222222222222222222222222222222222222222222222222222200000055505222222222222222222200033333",
    "333330522222222222222222225052225555550222222222222222222222222222222222222222222222222222055555522250522222222222222222225033333",
    "333330222222222222222222220522222225555000222222222222222222222222222222222222222222222000555522222225022222222222222222222033333",
    "333330222222222222222222222222222222225555022222222222222222222222222222222222222222220555522222222222222222222222222222222033333",
    "333330222222222222222222222222222222222255502222222222222222222222222222222222222222205552222222222222222222222222222222222033333",
    "333330222222222222222222222222222222222225550222222222222222222222222222222222222222055522222222222222222222222222222222222033333",
    "333330022222222222226632222222222222222222555022222222222222222222222222222222222220555222222222222222222236622222222222220033333",
    "333330022222222222246662222222222222222222255022222222222222222222222222222222222220552222222222222222222266642222222222220033333",
    "333330002222222200546662222222222222222222225022222222222222222222222222222222222220522222222222222222222266645002222222200033333",
    "333333000222222022044422222222222222222222225002222222222222222222222222222222222200522222222222222222222224440220222222000333333",
    "333333300022222222885222222222222222222222222502222222222222222222222222222222222205222222222222222222222222580222222220003333333",
    "333333330002222200220222222222222222222222222502222222222222222222222222222222222205222222222222222222222222022002222200033333333",
    "333333333300000008228222222222222222222222222502222222222222222222222222222222222205222222222222222222222222022000000003333333333",
    "133333333333333302202222222222222222222222222502222222222222222222222222222222222205222222222222222222222222202203333333333333331",
    "133333333333333302222222222222222222222222222502222222222222222222222222222222222205222222222222222222222222222203333333333333331",
    "131333333333333302222222222222222222222222222502222222222222222222222222222222222205222222222222222222222222222203333333333333131",
    "513313333333333302222222222222222222222222222250222002222222222222222222222200222052222222222222222222222222222203333333333313315",
    "453331133333333302222222222222220222222222222250220552222222222222222222222255022052222222222222022222222222222203333333331133314",
    "113331531313333300222222222222205022222222222225005552222222222222222222222255500522222222222220502222222222222003333313135133311",
    "153311451133333330022222222222050222222222222225555522222222222222222222222225555522222222222222050222222222220033333331114113351",
    "533110110113333330002222222220502222205222222222220000000022222222222220000000022222222222502222205022222222200033333311011011335",
    "331101101533333333000222222205020000052222222222205555555502222222222205555555502222222222250000020502222222000333333335101101133",
    "333551011451333333300002222500200555522222222222052222222250222222222052222222250222222222225555002005222200003333333114110155333",
    "333335110155333333330000000000000002222222222222222222222225022222220522222222222222222222222200000000000000033333333551011533333",
    "333103101533133333333333333333333300222222222222222222222225022222220522222222222222222222222003333333333333333333331335101301333",
    "223553515333333333333333333333300330022222222222222222222225502222205522222222222222222222220033003333333333333333333333515355322",
    "112333353333313333333333333333303330022222222222222222222222550222055222222222222222222222220033303333333333333333313333353333211",
    "111233333115133333333333333333303330202222222222222222222222250222052222222222222222222222202033303333333333333333331511333332111",
    "011233331114511133333333333333330002222222222222222222222222220020022222222222222222222222222200033333333333333331111411133332110";
   
[/color][/size]
[size=1][color=blue]    "01010121010101010101033345433345433301010101",
    "10101020101010101010133354533354533310101010",
    "01010121010101010101033345433345433301010101",
    "10101020101010101010133354533354533310101010",
    "01010121010101010101033345433345433301010101",
    "10101020101010101010133354533354533310101010",
    "01010121010101010101033345433345433301010101",
    "10101020101010101010133354533354533310101010",
    "01010121010101010101033345433345433301010101",
    "10101020101010101010133354533354533310101010",
    "22222222222222222222222222222222222222222222",
    "10101020101010101010133354533354533310101010",
    "01010121010101010101033345433345433301010101",
    "10101020101010101010133354533354533310101010",
    "01010121010101010101033345433345433301010101",
    "10101020101010101010133354533354533310101010",
    "01010121010101010101033345433345433301010101",
    "10101020101010101010133354533354533310101010",
    "01010121010101010101033345433345433301010101",
    "10101020101010101010133354533354533310101010",
    "01010121010101010101033345433345433301010101",
    "10101020101010101010133354533354533310101010",
    "01010121010101010101033345433345433301010101",
    "10101020101010101010133354533354533310101010",
    "01010121010101010101033345433345433301010101",
    "66666626666666666666666666666666666666666666",
    "66666626666666666666666666666666666666666666",
    "66666626666666666666666666666666666666666666",
    "77777727777777777777733377733377733377777777",
    "77777727777777777777733377733377733377777777",
    "77777727777777777777733377733377733377777777",
    "66666626666666666666666666666666666666666666",
    "66666626666666666666666666666666666666666666",
    "66666626666666666666666666666666666666666666",
    "77777727777777777777733377733377733377777777",
    "77777727777777777777733377733377733377777777",
    "77777727777777777777733377733377733377777777",
    "66666626666666666666666666666666666666666666",
    "66666626666666666666666666666666666666666666",
    "66666626666666666666666666666666666666666666",
    "01010121010101010101033345433345433301010101",
    "10101020101010101010133354533354533310101010",
    "01010121010101010101033345433345433301010101",
    "10101020101010101010133354533354533310101010";[/color][/size]
[size=1][color=blue][/color][/size]
[size=1][color=blue]    "012223012223012223012223012223",
    "122230122230101222301230122230",
    "222301222301230122230101222301",
    "223012223012223012223012223012",
    "230122230122222301222301222122",
    "301222301222122230122230122222",
    "012223012223012223012223012223",
    "122230101222301222301222301230",
    "222301230122230122230122230101",
    "223012223012223012223012223012",
    "222122222322230301222301222301",
    "122222322222301230122230122230",
    "012223012223012223012223012223",
    "301230122222122222301222301222",
    "230101222122222322230122230122",
    "223012223012223012223012223012",
    "222301222301230122230301222301",
    "122230122230301222301230122230",
    "012223012223012223012223012223",
    "301222322230122230122222301222",
    "230122222301222301222322230122",
    "223012223012223012223012223012",
    "222301230122230122230122230101",
    "122230301222301222301222301230",
    "012223012223012223012223012223",
    "322230122230122230101222122222",
    "222301222301222301230122222122",
    "223012223012223012223012223012",
    "230122230122230122222322222301",
    "301222301222301222122222322230",
    "012223012223012223012223012223",
    "122230122230101222301230122230",
    "222301222301230122230101222301",
    "223012223012223012223012223012",
    "230122230122222301222301222122",
    "301222301222222230122230122222";[/color][/size]
[size=1][color=blue][/color][/size]
[size=1][color=blue]    "0111011101110111000001110110011101100101011101110111011000100111011101010101",
    "1111111110111011111010111111101011111011111010111111101011111011101111111110",
    "1110110001011110010101001101111101011111110111111110010111001111110001101111",
    "1111101011111110101111101011111110111011101111111010111110101111111010111110",
    "0111000011110110000101110001000100110101001100000001011100010111011100010101",
    "1010111011111111101110111111111110111011101111111111101110111111111011101011",
    "1110110001111111111001000111011111110101111111011100010011111111110001001111",
    "1011111111111111111011101110101011111011111010101110111011111111111111111011",
    "0111010100000111010111010000010001110101010001100011011101110111000101110110",
    "1010111111101011111010111011101110111011101110111011101011111010111111101011",
    "1100110101110101110001110100110111010101000101100101110011010101110101101100",
    "1110111110101010111011111111101010111011101010111111111011101010101111101110",
    "0111010101110000111101110111010101010101010101110111011101110001010101000111",
    "1110111010111110111111101111111011111011111011111110111111101111101011101110",
    "0101010001011111111011000111010101010101010111011100011011111101010001010100",
    "1111111110101111111011111010101110111011101110101011111011111110101111111110",
    "0011011100010111000100010000000100110001001100110011000100110111001001110011",
    "1110101111101111101110101111101110101010101110111110101110111110111110101110",
    "0111110011100111110111110101110111001110110101110101111101011100110001111101",
    "1110111011101111111111111011101111111111111110111011111111111110111011101110",
    "0111011100110011011001100111001001110111111100010101011101110001100101000111",
    "1111111110111011111011111110101011111111111010101111111011111011101111111111",
    "1110011111000111010001010111010101100100110101011101110001011100011111001111",
    "1110111111101111101010101011111111101110111111111010101010111110111111101110",
    "0000011101100111010101100111001101010101011000010110010101100111011101110011",
    "1010111111111110111110101011111110111011101111111010101111101111111111101011",
    "0101111011011100010011011100011011010101010011000111011011000111110011110100",
    "1111111011111110101010101110101010111011101010101110101010101111111011111110",
    "0111000100110111110101110111011100010101000101011111011001110111100100111101",
    "1111111110101110111110101010101010111011101010101010101111101110101111111110",
    "1100011101110101011011011110111001110101110011001111011011011101110111000110",
    "1010111110111111101011101011111011101010111011111010111010111111101111101011",
    "0011011101000111011101110101000101110001011000110111011101000111011101010011",
    "1111111111101110111011111111101011111011111010111111111011101110111111111110",
    "0100111111000100110101011101010011011111110001011111010111001100110111101100",
    "1111111111101110111110101110111111111011111111101110101111101110111111111110",
    "0011010101110110111101110101011110110001001111000111011001110100110101010011",
    "1010101011101111101011101011111111111011111111111010111010111110111010101011",
    "1101110001011101011001000111110011101100111001011100010011011101010001110110",
    "1110111010101110111011101111111010111011101011111110111011101110101011101110",
    "0011011100111111000000110111011101110101010101110111001100110111001101110001",
    "1111101011111110101111101110111111111011111111101110111110101111111010111110",
    "1100011111011100010101101110010111001110110101001100110111000111110111001110",
    "1110111111101011111010111111101011111011111010111111101011111010111111101110",
    "0111010000010111010100110111000001110001010100110111000001110100000101111101",
    "1110111111111110111011111111101110101110101110111111111011101111111111101110",
    "0110111001110100011111011111010111111101111101011111111111000101110011101101",
    "1111101010111011101111111111111111101010111111111111111110111011101010111110",
    "0111000100000101010101110000010101000001011101010011011101110110001100010101",
    "1110111011101110101111101111111110101010101111111110111110101110111011101110",
    "0100110111000110010111011101010011000100010001011101011111001100010101000101",
    "1110101011111111101110111010111110111111101111101011101110111111111010101110",
    "0101010111110111001101110111000100110011001100010101011100110111011101010101",
    "1111101111111011111110111110101110111011101110101111101111111011111110111110",
    "0101011101100101111111111100010111000100011101000111111111110100110111010101",
    "1110111010101111101111111010111111101110111111101011111110111110101011101110",
    "0110010100000101010001110100111101100001011101100111011101000111001001110100",
    "1010111011111010111011111011111010101010101011111011111011101011111011101010",
    "1101110011010110110011110011110011101110110001111101111001001101011001111101",
    "1111111011101111111111111011101110111111101110111011111111111110111011111111",
    "1111001001110011001101100111011100110111000101001101011100110001010000111111",
    "1111101010111111101111101110111111111111111111101110111110111111101010111111",
    "0111010001110100010001010101111101101110110111110101110001001101110001011101",
    "1011111111101010101011111011111110111011101111111011111010101010111111111011",
    "0101001101111011010100110011011100000111001111110011001101010011010000110101",
    "1110111111101010111110111111111110101110101111111111101111101010111111101110",
    "0100111001011101100101011111110111010101011111111101010111010111010011100101",
    "1110101010111010101010111111101111111011111110111111101010101011101010101110",
    "0101011101110111000100110111000011110001011100001111001100110111010101000101",
    "1110101010101010111110111010111111111011111111101011101111101010101010101110",
    "0110011011111101111101100110011001011111010011001100110111110111111011001101",
    "1011101111101011101011111110111110101110101111101111111010111010111110111010",
    "0111000101010111011100110001011101100111010101110011000101110111011000110100",
    "1111101011111111101110111011111111111011111111111011101110111111111010111110",
    "1111110101001100010011110101111111110101110111111101111011000100110101111100",
    "1111111110111010111110111011111111111011111111111011101111101011101111111110",
    "0111011100010111001100110011010101110110010101011001001100110111000101100101",
    "1111111111101011101011111011101010101110101010111011111010111010111111111110",
    "1111110111110101011101101100010011011101011001000110110111010101111101011111",
    "1110101111111011101110111010101110111011101110101011101110111011111110101110";
   [/color][/size]

全部源码点击这里下载看吧 [attach]691[/attach]

[[i] 本帖最后由 dreamfly 于 2007-12-5 22:40 编辑 [/i]]

dreamfly 2007-12-5 22:41

:lol

好玩不？

css还可以这样玩。

:hug:

iconsbox 2007-12-5 22:48

啊啊啊啊？怎么也要有个基础的底纹图片调用吧~~~~:funk:

vvvv888 2008-1-13 10:09

下载不到:@

bottle31 2008-1-13 18:02

啊    .css文件还能这样啊。   到底是怎么实现的呢？

q-_-p 2008-1-15 12:16

:( ccs样式被你玩成精了～
:unhappy: 神啊，asp我是一窍不通，救救偶吧～

dreamfly 2008-1-30 11:31

[quote]原帖由 [i]q-_-p[/i] 于 2008-1-15 12:16 发表 [url=http://www.iconfans.com/redirect.php?goto=findpost&pid=1553&ptid=268][img]http://www.iconfans.com/images/common/back.gif[/img][/url]
:( ccs样式被你玩成精了～
:unhappy: 神啊，asp我是一窍不通，救救偶吧～ [/quote]
这不是asp :stupid:

lushsight 2008-2-15 10:40

这个太强了:hug:

L.J 2008-2-19 05:11

挺好玩的...学习了:lol

ladolf 2008-3-18 10:09

XML+CSS? 说真的很强大很强大

达达 2008-3-26 11:49

flex还可以这么玩，强悍！

heeroyuyj 2008-4-2 22:40

实用性高不高呢?

而且这样的背景, 人的眼睛看了, 有点儿吃不消啊:@

風亦飛 2008-4-22 22:29

这样的真是太神奇了.只有神仙才看得懂的说...

感觉就象是用css那些文字样式来生成bg图片/
页: [1]
查看完整版本: FLEX实现的背景