VB.net 2010 视频教程 VB.net 2010 视频教程 python基础视频教程
SQL Server 2008 视频教程 c#入门经典教程 Visual Basic从门到精通视频教程
当前位置:
首页 > 网站开发 > HTML >

  • HTML5 教程之Foundation 网格 - 水平堆叠

以下实例创建了一个基本的网格系统，在 PC 和平板设备上它是水平平铺的，在手机等小型设备上它是水平堆叠的。

实例


	
    
		
  1. 
			 <div class="row">
    2. 
		
  2. 
			  <div class="medium-6 columns" style="background-color:yellow;">
    3. 
		
  3. 
			    <p>手册网教程</p>
    4. 
		
  4. 
			  </div>
    5. 
		
  5. 
			  <div class="medium-6 columns" style="background-color:pink;">
    6. 
		
  6. 
			    <p>手册网教程</p>
    7. 
		
  7. 
			  </div>
    8. 
		
  8. 
			</div>
    9. 
	

	

		复制

	实例预览 »



	
		

			
				提示:  .small|medium|large-* 类中的数字指定了跨越的列数。所以， .small-1 跨越 1 列, .small-4 跨越 4 列, .small-6 跨越 6 列 (50% 宽度) 等。 注意: 要保证数列加起来是 12 列! 
		

	





      



  

  
  

   
    
    
   

  

  
 
 

 
 
  
 
 
 
 






 






相关教程