现在比较流行的三级菜单，京东商城，淘宝网效果等等。（修正版）

首先想关注过我的朋友们表示歉意。由于疏忽文章写的有点杂乱。修正我整理了一下。代码不是主要的在于一些话的分享。技术只是抛砖引玉了一下。

顺便和大家分享一些文字。

先看一下效果图
产品端点效应：两个端点的产品更容易快速形成品牌及规模效益：一是高端产品，锁定奢侈消费，高投稿高价值高回报。二是简易产品，不追求附加值，仅满足客户基本需求，如快捷酒店只提睡眠%2B洗澡%2B上网%2B早餐。很简单，但却占领了庞大市场份额，低投入低价值低回报，但可以快速复

 
   
   页面
 1  
   < 
   div  
   class 
   ='allsort' 
   > 
   
 2                      
   < 
   div  
   class 
   ='mt' 
   > 
   
 3                          
   < 
   strong 
   > 
   导航菜单 
   </ 
   strong 
   > 
   
 4                      
   </ 
   div 
   > 
   
 5                      
   < 
   div  
   class 
   ='mc' 
   > 
   
 6                          
   < 
   asp:Repeater  
   ID 
   ="BigMenu" 
    runat 
   ="server" 
    OnItemDataBound 
   ="BigMenu_ItemDataBound" 
   
 7                             EnableViewState 
   ="false" 
   > 
   
 8                              
   < 
   ItemTemplate 
   > 
   
 9                                  
   < 
   div  
   class 
   ='item  
   ' 
   > 
   
10                                      
   < 
   span 
   > 
     
   < 
   h3 
   > 
      
   < 
   a  
   href 
   ="#" 
   > 
     
   <% 
   # 
   Eval 
   ( 
   " 
   menu_name 
   " 
   )  
   %> 
   </ 
   a 
   ></ 
   h3 
   > 
      
   </ 
   span 
   > 
   //第一级
11                                      
   < 
   div  
   class 
   ='i-mc' 
   > 
   
12                                          
   < 
   div  
   class 
   ='subitem' 
   > 
   
13                                              
   < 
   asp:Repeater  
   ID 
   ="MinMenu" 
    runat 
   ="server" 
    OnItemDataBound 
   ="MinMenu_ItemDataBound" 
     EnableViewState 
   ="false" 
   > 
   
14                                                  
   < 
   ItemTemplate 
   > 
   
15                                                      
   < 
   dl  
   class 
   ="fore" 
   > 
     
   < 
   dt  
   >< 
   a  
   href 
   ="#" 
   > 
       
   <% 
   # 
   Eval 
   ( 
   " 
   sub_name 
   " 
   ) 
   %> 
   </ 
   a 
   ></ 
   dt 
   > 
   
16                                                      
   < 
   dd 
   >< 
   em 
   >< 
   a  
   href 
   ="#" 
   > 
   
17                                                                  
   < 
   asp:Repeater  
   ID 
   ="MinMenu2" 
    runat 
   ="server" 
    EnableViewState 
   ="false" 
   > 
   //第二级
18                                                                      
   < 
   ItemTemplate 
   > 
   
19                                                                        
   < 
   a  
   href 
   ="#" 
    onclick 
   ="fn_getmenu1('<%#Eval(" 
   menu_name")% 
   > 
   ',' 
   <% 
   # 
   Eval 
   ( 
   " 
   menu_code 
   " 
   ) 
   + 
   " 
   ?menuId= 
   " 
   + 
   Eval 
   ( 
   " 
   menu_id 
   " 
   ) 
   + 
   ( 
   Eval 
   ( 
   " 
   open_parameter 
   " 
   )! 
   = 
   "" 
    ?  
   " 
   & 
   " 
   + 
   Eval 
   ( 
   " 
   open_parameter 
   " 
   ) :  
   "" 
   ) 
   %> 
   ',' 
   <% 
   # 
   Eval 
   ( 
   " 
   menu_id 
   " 
   ) 
   %> 
   ',' 
   <% 
   # 
   Eval 
   ( 
   " 
   open_type 
   " 
   ) 
   %> 
   ')">// 第三级
20                                                                              
   <% 
   # 
   Eval 
   ( 
   " 
   menu_name 
   " 
   ) 
   %> 
   
21                                                                          
   </ 
   a 
   > 
   
22                                                                   
   <% 
   #((Container.ItemIndex  
   + 
     
   1 
   ) %  
   4 
   )  
   == 
     
   0 
    ?  
   " 
   <br/> 
   " 
    :  
   "" 
     
   %> 
    // 控制每行显示多少个
23                                                                      
   </ 
   ItemTemplate 
   > 
   
24                                                                  
   </ 
   asp:Repeater 
   > 
   
25                                                              
   </ 
   a 
   ></ 
   em 
   > 
   
26                                                          
   </ 
   dd 
   > 
   
27                                                      
   </ 
   dl 
   > 
   
28                                                  
   </ 
   ItemTemplate 
   > 
   
29                                              
   </ 
   asp:Repeater 
   > 
   
30                                          
   </ 
   div 
   > 
   
31                                      
   </ 
   div 
   > 
   
32                                  
   </ 
   div 
   > 
   
33                              
   </ 
   ItemTemplate 
   > 
   
34                          
   </ 
   asp:Repeater 
   > 
   
35 
36                          
   < 
   script  
   type 
   ="text/javascript" 
   > 
   
 
   37 
                                $( 
   " 
   .allsort 
   " 
   ).hoverForIE6({ current:  
   " 
   allsorthover 
   " 
   , delay:  
   150 
    });
 
   38 
                                $( 
   " 
   .allsort .item 
   " 
   ).hoverForIE6({ delay:  
   150 
    });
 
   39 
         
   
 

经验是创新的天敌，往往因有经验而散漫傲物，就因为这经验，而令其思维陷入固定的模式中无法突破，经验这东西成事不足，败事有余，经验只能作为进入某个领域的基础，而不能作为权衡人才的标准。根据左右机构观察，70%的创新来自于无经验人士，有经验只能做纵深研究，无法横向贯通。

做营销只需要做好两件事：研究客户和研究对手。研究客户，知道客户想要什么，不喜欢什么，从而开发出适销对路的产品；研究

 
   
   js脚本：
( 
   function 
   ($) { $.extend($.browser, { client:  
   function 
   () {  
   return 
    { width: document.documentElement.clientWidth, height: document.documentElement.clientHeight, bodyWidth: document.body.clientWidth, bodyHeight: document.body.clientHeight }; }, scroll:  
   function 
   () {  
   return 
    { width: document.documentElement.scrollWidth, height: document.documentElement.scrollHeight, bodyWidth: document.body.scrollWidth, bodyHeight: document.body.scrollHeight, left: document.documentElement.scrollLeft, top: document.documentElement.scrollTop  
   + 
    document.body.scrollTop }; }, screen:  
   function 
   () {  
   return 
    { width: window.screen.width, height: window.screen.height }; }, isIE6: $.browser.msie  
   && 
    $.browser.version  
   == 
     
   6 
   , isMinW:  
   function 
   (val) {  
   return 
    Math.min($.browser.client().bodyWidth, $.browser.client().width)  
   <= 
    val; }, isMinH:  
   function 
   (val) {  
   return 
    $.browser.client().height  
   <= 
    val; } }) })(jQuery); ( 
   function 
   ($) { $.widthForIE6  
   = 
     
   function 
   (option) {  
   var 
    s  
   = 
    $.extend({ max:  
   null 
   , min:  
   null 
   , padding:  
   0 
    }, option  
   || 
    {});  
   var 
    init  
   = 
     
   function 
   () {  
   var 
    w  
   = 
    $(document.body);  
   if 
    ($.browser.client().width  
   >= 
    s.max  
   + 
    s.padding) { w.width(s.max  
   + 
     
   " 
   px 
   " 
   ); }  
   else 
     
   if 
    ($.browser.client().width  
   <= 
    s.min  
   + 
    s.padding) { w.width(s.min  
   + 
     
   " 
   px 
   " 
   ); }  
   else 
    { w.width( 
   " 
   auto 
   " 
   ); } }; init(); $(window).resize(init); } })(jQuery);
( 
   function 
   ($) { $.fn.hoverForIE6  
   = 
     
   function 
   (option) {  
   var 
    s  
   = 
    $.extend({ current:  
   " 
   hover 
   " 
   , delay:  
   1000 
    }, option  
   || 
    {}); $.each( 
   this 
   ,  
   function 
   () {  
   var 
    timer1  
   = 
     
   null 
   , timer2  
   = 
     
   null 
   , flag  
   = 
     
   false 
   ; $( 
   this 
   ).bind( 
   " 
   mouseover 
   " 
   ,  
   function 
   () {  
   if 
    (flag) { clearTimeout(timer2); }  
   else 
    {  
   var 
    _this  
   = 
    $( 
   this 
   ); timer1  
   = 
    setTimeout( 
   function 
   () { _this.addClass(s.current); flag  
   = 
     
   true 
   ; }, s.delay); } }).bind( 
   " 
   mouseout 
   " 
   ,  
   function 
   () {  
   if 
    (flag) {  
   var 
    _this  
   = 
    $( 
   this 
   ); timer2  
   = 
    setTimeout( 
   function 
   () { _this.removeClass(s.current); flag  
   = 
     
   false 
   ; }, s.delay); }  
   else 
    { clearTimeout(timer1); } }) }) } })(jQuery);
( 
   function 
   ($) {
    $.extend({ _jsonp: { scripts: {}, counter:  
   1 
   , head: document.getElementsByTagName( 
   " 
   head 
   " 
   )[ 
   0 
   ], name:  
   function 
   (callback) {
         
   var 
    name  
   = 
     
   ' 
   _jsonp_ 
   ' 
     
   + 
    ( 
   new 
    Date).getTime()  
   + 
     
   ' 
   _ 
   ' 
     
   + 
     
   this 
   .counter;  
   this 
   .counter 
   ++ 
   ;
         
   var 
    cb  
   = 
     
   function 
   (json) { eval( 
   ' 
   delete  
   ' 
     
   + 
    name); callback(json); $._jsonp.head.removeChild($._jsonp.scripts[name]);  
   delete 
    $._jsonp.scripts[name]; }; eval(name  
   + 
     
   ' 
    = cb 
   ' 
   );  
   return 
    name;
    }, load:  
   function 
   (url, name) {  
   var 
    script  
   = 
    document.createElement( 
   ' 
   script 
   ' 
   ); script.type  
   = 
     
   ' 
   text/javascript 
   ' 
   ; script.charset  
   = 
     
   this 
   .charset; script.src  
   = 
    url;  
   this 
   .head.appendChild(script);  
   this 
   .scripts[name]  
   = 
    script; } 
}, getJSONP:  
   function 
   (url, callback) {
     
   var 
    name  
   = 
    $._jsonp.name(callback); 
 
   var 
    url  
   = 
    url.replace( 
   / 
   {callback}; 
   / 
   , name); $._jsonp.load(url, name);  
   return 
     
   this 
   ; } }); })(jQuery);
( 
   function 
   ($) {
    $.fn.jdTab  
   = 
     
   function 
   (option, callback) {
         
   if 
    ( 
   typeof 
    option  
   == 
     
   " 
   function 
   " 
   ) { callback  
   = 
    option; option  
   = 
    {}; };
         
   var 
    s  
   = 
    $.extend({ type:  
   " 
   static 
   " 
   , auto:  
   false 
   , source:  
   " 
   data 
   " 
   , event:  
   " 
   mouseover 
   " 
   , currClass:  
   " 
   curr 
   " 
   , tab:  
   " 
   .tab 
   " 
   , content:  
   " 
   .tabcon 
   " 
   , itemTag:  
   " 
   li 
   " 
   , stay:  
   5000 
   , delay:  
   100 
   , mainTimer:  
   null 
   , subTimer:  
   null 
   , index:  
   0 
    }, option  
   || 
    {});
         
   var 
    tabItem  
   = 
    $( 
   this 
   ).find(s.tab).eq( 
   0 
   ).find(s.itemTag), contentItem  
   = 
    $( 
   this 
   ).find(s.content);  
   if 
    (tabItem.length  
   != 
    contentItem.length)  
   return 
     
   false 
   ;
         
   var 
    reg  
   = 
    s.source.toLowerCase().match( 
   / 
   http:\/\/|\d|\.aspx|\.ascx|\.asp|\.php|\.html\.htm|.shtml|.js|\W 
   / 
   g);
         
   var 
    init  
   = 
     
   function 
   (n, tag) { s.subTimer  
   = 
    setTimeout( 
   function 
   () { hide();  
   if 
    (tag) { s.index 
   ++ 
   ;  
   if 
    (s.index  
   == 
    tabItem.length) s.index  
   = 
     
   0 
   ; }  
   else 
    { s.index  
   = 
    n; }; s.type  
   = 
    (tabItem.eq(s.index).attr(s.source)  
   != 
     
   null 
   )  
   ? 
     
   " 
   dynamic 
   " 
    :  
   " 
   static 
   " 
   ; show(); }, s.delay); };
         
   var 
    autoSwitch  
   = 
     
   function 
   () { s.mainTimer  
   = 
    setInterval( 
   function 
   () { init(s.index,  
   true 
   ); }, s.stay); };
         
   var 
    show  
   = 
     
   function 
   () {
            tabItem.eq(s.index).addClass(s.currClass);  
   switch 
    (s.type) {
                 
   default 
   :  
   case 
     
   " 
   static 
   " 
   :
                     
   var 
    source  
   = 
     
   "" 
   ;  
   break 
   ;  
   case 
     
   " 
   dynamic 
   " 
   :
                     
   var 
    source  
   = 
    (reg  
   == 
     
   null 
   )  
   ? 
    tabItem.eq(s.index).attr(s.source) : s.source; tabItem.eq(s.index).removeAttr(s.source);  
   break 
   ;
            };  
   if 
    (callback) { callback(source, contentItem.eq(s.index), s.index); }; contentItem.eq(s.index).show();
        }; 
    
   var 
    hide  
   = 
     
   function 
   () { tabItem.eq(s.index).removeClass(s.currClass); contentItem.eq(s.index).hide(); }; tabItem.each( 
   function 
   (n) { $( 
   this 
   ).bind(s.event,  
   function 
   () { clearTimeout(s.subTimer); clearInterval(s.mainTimer); init(n,  
   false 
   );  
   return 
     
   false 
   ; }).bind( 
   " 
   mouseleave 
   " 
   ,  
   function 
   () {  
   if 
    (s.auto) { autoSwitch(); }  
   else 
    {  
   return 
   ; } }) });  
   if 
    (s.type  
   == 
     
   " 
   dynamic 
   " 
   ) { init(s.index,  
   false 
   ); };  
   if 
    (s.auto) { autoSwitch(); } } })(jQuery);
( 
   function 
   ($) {
    $.fn.jdSlide  
   = 
     
   function 
   (option) {
         
   var 
    settings  
   = 
    $.extend({ width:  
   null 
   , height:  
   null 
   , pics: [], index:  
   0 
   , type:  
   " 
   num 
   " 
   , current:  
   " 
   curr 
   " 
   , delay1:  
   200 
   , delay2:  
   8000 
    }, option  
   || 
    {});  
   var 
    element  
   = 
     
   this 
   ;  
   var 
    timer1, timer2, timer3, flag  
   = 
     
   true 
   ;  
   var 
    total  
   = 
    settings.pics.length;  
   var 
    init  
   = 
     
   function 
   () {  
   var 
    img  
   = 
     
   " 
   <ul style='position:absolute;top:0;left:0;'><li><a href=' 
   " 
     
   + 
    settings.pics[ 
   0 
   ].href  
   + 
     
   " 
   ' target='_blank'><img src=' 
   " 
     
   + 
    settings.pics[ 
   0 
   ].src  
   + 
     
   " 
   ' width=' 
   " 
     
   + 
    settings.width  
   + 
     
   " 
   ' height=' 
   " 
     
   + 
    settings.height  
   + 
     
   " 
   ' /></a></li></ul> 
   " 
   ; element.css({  
   " 
   position 
   " 
   :  
   " 
   relative 
   " 
    }).html(img); $( 
   function 
   () { delayLoad(); }) }; init();  
   var 
    initIndex  
   = 
     
   function 
   () {  
   var 
    indexs  
   = 
     
   " 
   <div> 
   " 
   ;  
   var 
    current;  
   var 
    x;  
   for 
    ( 
   var 
    i  
   = 
     
   0 
   ; i  
   < 
    total; i 
   ++ 
   ) { current  
   = 
    (i  
   == 
    settings.index)  
   ? 
    settings.current :  
   "" 
   ;  
   switch 
    (settings.type) {  
   case 
     
   " 
   num 
   " 
   : x  
   = 
    i  
   + 
     
   1 
   ;  
   break 
   ;  
   case 
     
   " 
   string 
   " 
   : x  
   = 
    settings.pics[i].alt;  
   break 
   ;  
   case 
     
   " 
   image 
   " 
   : x  
   = 
     
   " 
   <img src=' 
   " 
     
   + 
    settings.pics[i].breviary  
   + 
     
   " 
   ' /> 
   " 
   ;  
   default 
   :  
   break 
   ; }; indexs  
   += 
     
   " 
   <span class=' 
   " 
     
   + 
    current  
   + 
     
   " 
   '><a href=' 
   " 
     
   + 
    settings.pics[i].href  
   + 
     
   " 
   ' target='_blank'> 
   " 
     
   + 
    x  
   + 
     
   " 
   </a></span> 
   " 
   ; }; indexs  
   += 
     
   " 
   </div> 
   " 
   ; element.append(indexs); element.find( 
   " 
   span 
   " 
   ).bind( 
   " 
   mouseover 
   " 
   ,  
   function 
   (e) { clearInterval(timer1); clearInterval(timer3);  
   var 
    index  
   = 
    element.find( 
   " 
   span 
   " 
   ).index( 
   this 
   );  
   if 
    (index  
   == 
    settings.index) {  
   return 
   ; }  
   else 
    { timer3  
   = 
    setInterval( 
   function 
   () {  
   if 
    (flag) running(parseInt(index)); }, settings.delay1); } }).bind( 
   " 
   mouseleave 
   " 
   ,  
   function 
   (e) { clearInterval(timer3); timer1  
   = 
    setInterval( 
   function 
   () { running(settings.index  
   + 
     
   1 
   ,  
   true 
   ); }, settings.delay2); }) };  
   var 
    running  
   = 
     
   function 
   (index, tag) {
             
   if 
    (index  
   == 
    total) { index  
   = 
     
   0 
   ; }; element.find( 
   " 
   span 
   " 
   ).eq(settings.index).removeClass(settings.current); element.find( 
   " 
   span 
   " 
   ).eq(index).addClass(settings.current); timer2  
   = 
    setInterval( 
   function 
   () {
                 
   var 
    pos_y  
   = 
    parseInt(element.find( 
   " 
   ul 
   " 
   ).get( 
   0 
   ).style.top);
                 
   var 
    pos_a  
   = 
    Math.abs(pos_y  
   + 
    settings.index  
   * 
    settings.height);
                 
   var 
    pos_b  
   = 
    Math.abs(index  
   - 
    settings.index)  
   * 
    settings.height;
                 
   var 
    pos_c  
   = 
    Math.ceil((pos_b  
   - 
    pos_a)  
   / 
     
   4 
   );  
   if 
    (pos_a  
   == 
    pos_b) { clearInterval(timer2);  
   if 
    (tag) { settings.index 
   ++ 
   ;  
   if 
    (settings.index  
   == 
    total) { settings.index  
   = 
     
   0 
   ; } }  
   else 
    { settings.index  
   = 
    index; }; flag  
   = 
     
   true 
   ; }  
   else 
    {  
   if 
    (settings.index  
   < 
    index) { element.find( 
   " 
   ul 
   " 
   ).css({ top: pos_y  
   - 
    pos_c  
   + 
     
   " 
   px 
   " 
    }); }  
   else 
    { element.find( 
   " 
   ul 
   " 
   ).css({ top: pos_y  
   + 
    pos_c  
   + 
     
   " 
   px 
   " 
    }); }; flag  
   = 
     
   false 
   ; } 
            },  
   10 
   );
        }; 
  
   var 
    delayLoad  
   = 
     
   function 
   () {  
   var 
    img  
   = 
     
   "" 
   ;  
   for 
    ( 
   var 
    i  
   = 
     
   1 
   ; i  
   < 
    total; i 
   ++ 
   ) { img  
   += 
     
   " 
   <li><a href=' 
   " 
     
   + 
    settings.pics[i].href  
   + 
     
   " 
   ' target='_blank'><img src=' 
   " 
     
   + 
    settings.pics[i].src  
   + 
     
   " 
   ' width=' 
   " 
     
   + 
    settings.width  
   + 
     
   " 
   ' height=' 
   " 
     
   + 
    settings.height  
   + 
     
   " 
   ' /></a></li> 
   " 
   ; }; element.find( 
   " 
   ul 
   " 
   ).append(img); timer1  
   = 
    setInterval( 
   function 
   () { running(settings.index  
   + 
     
   1 
   ,  
   true 
   ); }, settings.delay2);  
   if 
    (settings.type) initIndex(); }; } })(jQuery);
   
   
 

对手，掌握敌我优劣势，知道何时应该围而不打，何时隔而不围，何时吃一个、挟一个、看一个，何时进攻、何时撤退转移，何时打局部战，何时打全歼战。

夏天总嫌床太小，而冬天却总感觉到床太大了，做营销就要认识到这种不同时段不同季节下的客户的不同需求，要认识到市场是随时在发生变化的，销售要因季节的变化而变化，所谓策略，是指某个阶段的谋划，而并非一策到底。

 
   
   CSS样式：
html, body, div, span, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, address, big, cite, code, del, em, font, img, ins, small, strong, var, b, u, i, center, dl, dt, dd, ol, ul, li, fieldset, form, label, legend
 
   { 
   
    margin 
   : 
    0 
   ; 
    padding 
   : 
    0 
   ; 
   
 
   } 
   

ol, ul 
   { 
     list-style 
   : 
    none 
   ; 
   } 
   
:focus 
   { 
      outline 
   : 
    0 
   ; 
   } 
   
a img 
   { 
      border 
   : 
    0 
   ; 
   } 
   
img 
   { 
     vertical-align 
   : 
    middle 
   ; 
     
   } 
   
table 
   { 
      empty-cells 
   : 
    show 
   ; 
     width 
   : 
    100% 
   ; 
     height 
   : 
    24px 
   ; 
   } 
   
ins 
   { 
      text-decoration 
   : 
    none 
   ; 
   } 
   
del 
   { 
      text-decoration 
   : 
    line-through 
   ; 
   } 
   
em 
   { 
      font-style 
   : 
    normal 
   ; 
   } 
   
.fl 
   { 
      float 
   : 
    left 
   ; 
   } 
   
.fr 
   { 
      float 
   : 
    right 
   ; 
   } 
   
 .fn 
   { 
      float 
   : 
    none 
   ; 
   } 
   
.al 
   { 
      text-align 
   : 
    left 
   ; 
   } 
   
.ac 
   { 
      text-align 
   : 
    center 
   ; 
   } 
   
.ar 
   { 
     text-align 
   : 
    right 
   ; 
   } 
   
.clr
 
   { 
   
    display 
   : 
    block 
   ; 
   
    overflow 
   : 
    hidden 
   ; 
   
    clear 
   : 
    both 
   ; 
   
    height 
   : 
    0 
   ; 
   
    line-height 
   : 
    0 
   ; 
   
    font-size 
   : 
    0 
   ; 
   
 
   } 
   
.clearfix:after
 
   { 
   
    content 
   : 
    "." 
   ; 
   
    display 
   : 
    block 
   ; 
   
    height 
   : 
    0 
   ; 
   
    clear 
   : 
    both 
   ; 
   
    visibility 
   : 
    hidden 
   ; 
   
 
   } 
   
.clearfix 
   { 
     display 
   : 
    inline-table 
   ; 
   } 
   
 
   /* 
    Hides from IE-mac \ 
   */ 
   *html .clearfix 
   { 
     height 
   : 
    1% 
   ; 
   } 
   
.clearfix 
   { 
   display 
   : 
    block 
   ; 
   } 
   
 
   /* 
    End hide from IE-mac  
   */ 
   * + html .clearfix 
   { 
     min-height 
   : 
    1% 
   ; 
   } 
   
.overflow 
   { 
      overflow 
   : 
    hidden 
   ; 
   } 
   
.form label, .form input, .form select, .form textarea, .form button, .form .label
 
   { 
   
    float 
   : 
    left 
   ; 
   
    font-size 
   : 
    12px 
   ; 
   
 
   } 
   
.block 
   { 
    display 
   : 
    block 
   ; 
      overflow 
   : 
    hidden 
   ; 
     cursor 
   : 
    pointer 
   ; 
   } 
   
.hide 
   { 
     display 
   : 
    none 
   ; 
   } 
   
.invisible 
   { 
      visibility 
   : 
    hidden 
   ; 
   } 
   
.tab 
   { 
     overflow 
   : 
    hidden 
   ; 
      zoom 
   : 
    1 
   ; 
   } 
   
.tab li, .tab a, .tab-item
 
   { 
     float 
   : 
    left 
   ; 
    
    cursor 
   : 
    pointer 
   ; 
   
     text-align 
   : 
    center 
   ; 
   
      
   } 
   
.m, .mt, .mc, .mb 
   { 
    overflow 
   : 
    hidden 
   ; 
      zoom 
   : 
    1 
   ; 
   } 
   
.mt .extra 
   { 
     float 
   : 
    right 
   ; 
   } 
   
.m 
   { 
      margin-bottom 
   : 
    10px 
   ; 
   } 
   
.btn-img 
   { 
   cursor 
   : 
    pointer 
   ; 
      margin 
   : 
    0 
   ; 
    padding 
   : 
    0 
   ; 
     border 
   : 
    0 
   ; 
    text-align 
   : 
    center 
   ; 
   } 
   
.btn-text 
   { 
     cursor 
   : 
    pointer 
   ; 
     margin 
   : 
    0 
   ; 
    padding 
   : 
    0 
   ; 
    text-align 
   : 
    center 
   ; 
   } 
   
 
   /* 
   text 
   */ 
   
body 
   { 
      font-family 
   : 
    "宋体" ,Arial,Lucida,Verdana,Helvetica,sans-serif 
   ; 
    font-size 
   : 
    12px 
   ; 
     color 
   : 
    #333 
   ; 
    line-height 
   : 
    150% 
   ; 
      background 
   : 
    #fff 
   ; 
   } 
   
h1 
   { 
    font-size 
   : 
    20px 
   ; 
   font-family 
   : 
    Arial,Lucida,Verdana, "宋体" ,Helvetica,sans-serif 
   ; 
   } 
   
h2 
   { 
     font-size 
   : 
    14px 
   ; 
   } 
   
h3 
   { 
      font-size 
   : 
    14px 
   ; 
   } 
   
h4 
   { 
      font-size 
   : 
    12px 
   ; 
   } 
   
h5 
   { 
      font-size 
   : 
    12px 
   ; 
   } 
   
h6 
   { 
      font-size 
   : 
    12px 
   ; 
   } 
   
 
   /* 
   link 
   */ 
   
a:link, a:visited 
   { 
     color 
   : 
    #333 
   ; 
     text-decoration 
   : 
    none 
   ; 
   } 
   
a:hover 
   { 
    color 
   : 
    #c00 
   ; 
      text-decoration 
   : 
    underline 
   ; 
   } 
   
#header 
   { 
     margin-bottom 
   : 
    7px 
   ; 
       height 
   : 
    22px 
   ; 
   } 
   

 
   /* 
   allsort 
   */ 
   
 
   /* 
    定位  
   */ 
    
.allsort
 
   { 
   
    float 
   : 
    left 
   ; 
   
        width 
   : 
    141px 
   ; 
   
        height 
   : 
    600px 
   ; 
   
        margin-right 
   : 
    4px 
   ; 
   
        background-color  
   : 
   #D2E0F2 
   ; 
   
        background 
   : 
    no-repeat 0 -166px 
   ; 
   
        position 
   : 
     relative 
   ; 
   
        z-index 
   : 
    11 
   ; 
   
    left 
   : 
    9px 
   ; 
   
    top 
   : 
    56px 
   ; 
   
     background  
   : 
    url(../Login/dl-Image/1-3-150.jpg) repeat-y 
   ; 
   
     
 
   } 
   
.allsort .mt
 
   { 
   
    height 
   : 
    25px 
   ; 
   
    width 
   : 
    141px 
   ; 
   
    line-height 
   : 
    25px 
   ; 
   
    background 
   : 
    url(../Login/dh/1-2-h.jpg) no-repeat 
   ; 
    
    cursor 
   : 
    pointer 
   ; 
   
    
 
   } 
   
 
   /* 
    <strong>导航菜单</strong>字体控制 
   */ 
   
.allsort .mt strong
 
   { 
   
    float 
   : 
    left 
   ; 
   
    font-size 
   : 
    14px 
   ; 
   
    color 
   : 
    #630 
   ; 
   
    width 
   : 
    140px 
   ; 
   
    height 
   : 
    25px 
   ; 
   
   text-align  
   : 
   center 
   ; 
   
 
   } 
   
#o-search .allsort .mt a
 
   { 
   
    color 
   : 
    #630 
   ; 
   
 
   } 
   
.allsort .mt .extra
 
   { 
   
    display 
   : 
    none 
   ; 
   
 
   } 
   
 
   /* 
   大菜单单框  
   */ 
   
.allsort .mc
 
   { 
   
    border 
   : 
    0px solid #D2E0F2 
   ; 
   
    position 
   : 
    absolute 
   ; 
   
        top 
   : 
    30px 
   ; 
   
            overflow 
   : 
    visible 
   ; 
   
        width 
   : 
    135px 
   ; 
   
            padding 
   : 
    0 3px 0 
   ; 
   
            -moz-border-radius 
   : 
    0 0 0px 0px 
   ; 
   
            -webkit-border-radius 
   : 
    0 0 0px 0px 
   ; 
   
   left  
   : 
   -3px 
   ; 
   
    height 
   : 
    315px 
   ; 
   
 
   } 
   
.allsort .item
 
   { 
   
    width 
   : 
    140px 
   ; 
   
    height 
   : 
    33.5px 
   ; 
   
    background 
   : 
    url(../Login/dh/1-2-33px.jpg) no-repeat 
   ; 
   
    border-top 
   : 
    0px solid #f4f3f0 
   ; 
   
 
   } 
   
.allsort .fore
 
   { 
   
    
    border-top 
   : 
    none 
   ; 
   
 
   } 
   
.allsort span
 
   { 
   
    
    display 
   : 
    block 
   ; 
   
    width 
   : 
    150px 
   ; 
   
    position 
   : 
    relative 
   ; 
   
    z-index 
   : 
    1 
   ; 
   
 
   } 
   
 
   /* 
    导航字体、长和高  
   */ 
   
.allsort h3
 
   { 
   
    width 
   : 
    98px 
   ; 
   
    height 
   : 
    31px 
   ; 
   
    padding-left 
   : 
    40px 
   ; 
   
    border 
   : 
    0px solid #DCF1F0 
   ; 
   

    border-width 
   : 
    0px 0 0px 0px 
   ; 
   
    background 
   : 
    no-repeat -318px -240px 
   ; 
   
    font-weight 
   : 
    normal 
   ; 
   
 
   } 
   
.allsort h3 a:link, .allsort h3 a:visited
 
   { 
   
 
    display 
   : 
    block 
   ; 
   
    height 
   : 
    30px 
   ; 
   
    line-height 
   : 
    30px 
   ; 
   
    color 
   : 
    #333 
   ; 
   
 
   } 
   
.allsort h3 a:hover, .allsort h3 a:active
 
   { 
   
    color 
   : 
    #f6b704 
   ; 
   
 
   } 
   
.allsort s
 
   { 
   
    display 
   : 
    block 
   ; 
   
    position 
   : 
    absolute 
   ; 
   
    top 
   : 
    10px 
   ; 
   
    left 
   : 
    182px 
   ; 
   
    width 
   : 
    13px 
   ; 
   
    height 
   : 
    13px 
   ; 
   
    background 
   : 
    no-repeat -274px -216px 
   ; 
   
 
   } 
   
 
   /* 
     边框颜色 
   */ 
   
.allsort .item .i-mc
 
   { 
   
    display 
   : 
    none 
   ; 
   
    position 
   : 
    absolute 
   ; 
   
    left 
   : 
    141px 
   ; 
   
    top 
   : 
    0 
   ; 
   
    width 
   : 
   420px 
   ; 
   
    border 
   : 
    1px solid #f6b704 
   ; 
   
    background  
   : 
    url(../Login/dl-Image/1-3-488px.jpg)  
   ; 
   
    overflow 
   : 
    hidden 
   ; 
   
 
   } 
   
.allsort .item dt
 
   { 
   
    padding 
   : 
     3px 10px 0 0 
   ; 
   
    font-weight 
   : 
    bold 
   ; 
   
 
   } 
   

.allsort .item dd
 
   { 
   
    padding 
   : 
    3px 0 0 
   ; 
   
    overflow 
   : 
    hidden 
   ; 
   
    zoom 
   : 
    1 
   ; 
   
 
   } 
   


.allsort .subitem
 
   { 
   
    float 
   : 
    left 
   ; 
   
    width 
   : 
    500px 
   ; 
   
    min-height 
   : 
    370px 
   ; 
   
    padding 
   : 
    0 4px 0 8px 
   ; 
   
 
   } 
   


.subitem.left
 
   { 
   
    float 
   : 
   left  
   ; 
   
    width  
   : 
   550px 
   ; 
   
    height  
   : 
   70px 
   ; 
   
    display 
   : 
    none 
   ; 
   
    position 
   : 
    absolute 
   ; 
   
    
 
   } 
   
.allsort .subitem dl
 
   { 
   
    border-top 
   : 
    0px solid #f6b704 
   ; 
   
    padding 
   : 
    6px 0 
   ; 
   
    overflow 
   : 
    hidden 
   ; 
   
    zoom 
   : 
    1 
   ; 
   
 
   } 
   

.allsort .subitem .fore
 
   { 
   
    border-top 
   : 
    none 
   ; 
   
 
   } 
   
 
   /* 
    二级菜单控制 
   */ 
   
.allsort .subitem dt
 
   { 
   
    float 
   : 
    left 
   ; 
   
    width 
   : 
   65px 
   ; 
   
    line-height 
   : 
    22px 
   ; 
   
    text-align 
   : 
    right 
   ; 
   
 
   } 
   
.allsort .subitem dd
 
   { 
   
    float 
   : 
    left 
   ; 
   
    width 
   : 
    380px 
   ; 
   
 
   } 
   
 
   /* 
    二级菜单颜色控制 
   */ 
   
.allsort .subitem dt a
 
   { 
   
    color 
   : 
    #c00 
   ; 
   
 
   } 
   
 
   /* 
   设置功能列表分割标示 
   */ 
   
.allsort .subitem dd a
 
   { 
   
    border-right  
   : 
   #f6b704 1px solid 
   ; 
   
      border-left 
   : 
   :#f6b704 1px solid 
   ; 
   
    padding 
   : 
    0 5px 
   ; 
   
    margin-bottom 
   : 
    5px 
   ; 
   
    text-decoration 
   : 
    underline 
   ; 
   
    display 
   : 
    inline-block 
   ; 
   
    line-height 
   : 
    15px 
   ; 
   
 
   } 
   
 
   /* 
   去掉后会换行    
.allsort .subitem em
{
    float: left;
    height: 14px;
    margin: 4px 0;
    line-height: 14px;
    padding:  0 10px;
    border-left: 0px solid #f6b704;
}     
   */ 
   

#o-search .allsort .subitem dt a
 
   { 
   
    color 
   : 
    #c00 
   ; 
   
   
 
   } 
   
#o-search .allsort .subitem dd a
 
   { 
   
    white-space 
   : 
    pre-wrap  
   ; 
   
 
   } 
   
.allsort .fr
 
   { 
   
    background 
   : 
    #fff 
   ; 
   
    width 
   : 
    176px 
   ; 
   
    padding-bottom 
   : 
    2010px 
   ; 
   
    margin-bottom 
   : 
    -2000px 
   ; 
   
 
   } 
   
.allsort .fr dl
 
   { 
   
    padding-bottom 
   : 
    0 
   ; 
   
 
   } 
   
#o-search .allsort .fr a
 
   { 
   
    color 
   : 
    #666 
   ; 
   
 
   } 
   
.allsort .brands
 
   { 
   
    width 
   : 
    140px 
   ; 
   
    padding 
   : 
    6px 8px 
   ; 
   
 
   } 
   
.allsort .brands em
 
   { 
   
    float 
   : 
    left 
   ; 
   
    width 
   : 
    80px 
   ; 
   
 
   } 
   
.allsort .brands dd
 
   { 
   
    padding-top 
   : 
    6px 
   ; 
   
    line-height 
   : 
    20px 
   ; 
   
 
   } 
   
.allsort .promotion
 
   { 
   
    width 
   : 
    140px 
   ; 
   
    padding 
   : 
    6px 8px 
   ; 
   
 
   } 
   


.allsort .promotion dd
 
   { 
   
    padding-top 
   : 
    6px 
   ; 
   
    line-height 
   : 
    20px 
   ; 
   
 
   } 
   
.allsort .mc .extra
 
   { 
   
    padding 
   : 
    7px 8px 
   ; 
   
    background 
   : 
    #FDF1DE 
   ; 
   
    border-top 
   : 
    0px solid #f6b704 
   ; 
   
 
   } 
   


#o-search .allsort .mc .extra a
 
   { 
   
    color 
   : 
    #c00 
   ; 
   
 
   } 
   
 
   /* 
   w为负数时鼠标移上后会会出现底线。 
   */ 
   
.allsorthover
 
   { 
   
    background-position 
   : 
    0  166px 
   ; 
   
 
   } 
   
.allsorthover .mt .extra
 
   { 
   
    background-position 
   : 
    -274px -190px 
   ; 
   
 
   } 
   
.allsorthover .mc
 
   { 
   
    display 
   : 
    block 
   ; 
   
 
   } 
   
.allsort .hover span
 
   { 
   
    z-index 
   : 
    13 
   ; 
   
    width 
   : 
    140px 
   ; 
   
 
   } 
   
 
   /* 
    鼠标移动上去后大菜单变化样式 
   */ 
   
.allsort .hover h3
 
   { 
   
    border 
   : 
    solid #f6b704 
   ; 
   
    border-width 
   : 
    1px 0 1px 1px 
   ; 
   
    overflow 
   : 
    hidden 
   ; 
   
    background 
   : 
    #FFF9EF no-repeat -318px -172px 
   ; 
   
    font-weight 
   : 
    bold 
   ; 
   
 
   } 
   
.allsort .hover s
 
   { 
   
    display 
   : 
    none 
   ; 
   
 
   } 
   
.allsort .hover .i-mc
 
   { 
   
    display 
   : 
    block 
   ; 
   
    z-index 
   : 
    12 
   ; 
   
 
   } 
   
*html .allsort .item dd
 
   { 
   
    padding-bottom 
   : 
    6px 
   ; 
   
 
   } 
   
 

调查研究表明：1、人们担忧的事情40%从未发生过；2、30%的忧虑是过去发生过的事情，是无法改变的；3、12%的忧虑集中于别人出于自卑感而作出的批评，这些忧虑是多余的；4、10%的忧虑是那些琐碎的事情；5、只有8%的忧虑可以列入“合理”的范围，而8%当中有4%的事情是完全不能控制的。

85%的快乐由人际关系决定，仅15%的快乐来自于个人成就。人95%的时间是无聊、苦闷、孤独、落寞、烦闷、平淡的，只有5%的时间是风光的。所以，我们要学会处理好人际关系，学会忍受平淡无奇的生活。