• 

      

      2. <span id="z4nqb"></span>
      


      
	
      
		
      flex-grow
      
		
		
	
      

      

      
	
      
		
      語法：
      
		
      
			
      flex-grow：<number>
      
			
      默認值：0
      
			
      適用于：flex子項
      
			
      繼承性：無
      
			
      動畫性：是
      
			
      計算值：指定值
      
		
      
	
      
	
      
		
      取值：
      
		
      
			
      
				
      <number>：
      
				
      用數值來定義擴展比率。不允許負值
      
			
      
		
      
	
      
	
      
		
      說明：
      
		
      
			設置或檢索彈性盒的擴展比率。
			
        
				
      • 根據彈性盒子元素所設置的擴展因子作為比率來分配剩余空間。
        • 
				
      • 
					示例：b,c將按照1:3的比率分配剩余空間
					
        
						
        Code：
        
						
        <ul class="flex">
    <li>a</li>
    <li>b</li>
    <li>c</li>
</ul>

.flex{display:flex;width:600px;margin:0;padding:0;list-style:none;}
.flex li:nth-child(1){width:200px;}
.flex li:nth-child(2){flex-grow:1;width:50px;}
.flex li:nth-child(3){flex-grow:3;width:50px;}
        
						
        
							
        flex-grow的默認值為0，如果沒有顯示定義該屬性，是不會擁有分配剩余空間權利的。
        
							
        本例中b,c兩項都顯式的定義了flex-grow，flex容器的剩余空間分成了4份，其中b占1份，c占3分，即1:3
        
							
        flex容器的剩余空間長度為：600-200-50-50=300px，所以最終a,b,c的長度分別為：
        
							
        a: 50+(300/4)=200px
        
							
        b: 50+(300/4*1)=125px
        
							
        a: 50+(300/4*3)=275px
        
						
        
					
        
				
        • 
				
      • 對應的腳本特性為flexGrow。
        • 
			
      
		
      
	
      
	
      
		
      兼容性：
      
		
      
			
        
				
      • 淺綠 = 支持
        • 
				
      • 紅色 = 不支持
        • 
				
      • 粉色 = 部分支持
        • 
			
      
			
      
				
					
      
						Values
						IE
						Firefox
						Chrome
						Safari
						Opera
						iOS Safari
						Android Browser
						Android Chrome
					
      
				      
				
					
      
						Basic Support
						6.0-10.0
						2.0-21.0
						4.0-20.0
						6.0
						15.0+-webkit-
						6.0-6.1
						2.1-4.3
						18.0-19.0
					
      
					
      
						11.0+
						22.0+
						21.0+-webkit-
						6.1+-webkit-
						17.0+
						7.0+-webkit-
						4.4+
						20.0+-webkit-
					
      
					
      
						29.0+
						9.0+
						9.0+
						28.0+
					
      
				      
			
      
		
      
	
      
	
      
		
      示例：
      
		
      
			
			
      
		
      
	
      
	
      
		
      本頁最后更新時間：
      
		
      
			2015.7.29
		
      
	
      

      





    3. 

        

        2. <span id="z4nqb"></span>
        
在线日本高清
|
国产一级a毛一级a看免费漫画
|
国产一级a毛一级a看…
|
久草福利网站首页
|
B日烂了日B
|
成人精品视频网址
|
中国熟妇XXX.1
|
国产精品久久视频
|
欧美国产日韩色图
|
日本成人中文字幕
|