09.盒子模型

    
        
        
    
    
        

            D01_S01
            D01_S02
            D01_S03
            D01_S04
        
        

            D02_S01
            D02_S02
            D02_S03
            D02_S04
        
        

            D03_S01
            D03_S02
            D03_S03
            D03_S04
        
        

            D04_S01
            D04_S02
            D04_S03
            D04_S04
        
        

            

                D05_S01
            
        
    

+++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++
1.元素(element)或内容,元素可定义其高(height)和宽(width),但对行内元素无效,对当前元素而言;
2.内边距(padding)即嵌套元素外元素对内元素的间距,也就是此元素与其内嵌套元素的间距,对内元素而言;
3.边框(border)即当前元素的边线,可定义其线宽,颜色,类型等,对当前元素而言;
4.外边距(margin)即两同级元素的间距,margin-top和margin-bottom对行内元素无效,对于块元素嵌套,
  若此元素有同级元素对同级元素生效,若无,则向上一层,直至最外层;
5.外边距合并,margin-top和margin-bottom则大对小合并(同级元素或嵌套元素),只保留大的边距;
  空元素合并,直至遇到非空元素;
6.实际展示效果以及生效方式,以实际运行结果为准,才是最好的布局代码.

盒子模型

运行图片