Web前端入门学习（6）——浮动例子之鉴赏

浮动例子之鉴赏

在浮动原理及清除浮动一文中（http://cherry360.blog.51cto.com/12176744/1864258），简单介绍了浮动的相关基础知识，为了巩固知识点，本篇结合代码展示关于浮动的几个常见例子。

例1：九格子

显示结果：

例2：条纹

显示结果：

例3：钢琴按键

    
        
            
1
        
        
            
2
        
        
            
3
        
        
            
4
        
        
            
5
        
        
            
6
        
        
            
7
        
        
            
8
        
        
            
9
        
        
            
10
        
        
            
11
        
        
            
12
        
    

显示结果：

一般情况，一个元素里边所有子元素结构和样式都是一样，那咱们就把这看成是1个列表。以上就是这种情况。