实现常见的网页布局

所属专栏：前端只因变凤凰之路
作者简介：rchjr——五带信管菜只因一枚
前言：该系列将持续更新前端的相关学习笔记，欢迎和我一样的小白订阅，一起学习共同进步~
文章简介：本文介绍网页的常见布局。知识学习内容来自b站的 @黑马程序员 的视频

本篇文章实现上面常见的网页布局，其中一共分为4个部分，下面为数据

top

height:50px width:100%（或者不写，默认是和浏览器一样宽）

banner

height:150px width:980px margin:10px auto

box

height:300px width:980px margin:0 auto

box li

height:300px width:237px float:left margin-right:10px （最后一个为0）

footer

height:200px margin-top:10px width:100%（或者不写，默认是和浏览器一样宽）

    
    
    
    
    



    
top
    
banner
    

        

            
1
            
2
            
3
            
4
        
    
    
footer