南大软院21天学霸养成计划—第6天

今天是学习的第6天，今天由于做了一天的一共，没有时间看慕课，就看了一点点，下面我就来讲一讲我今天的收获。

 首先什么是布局？又称是板式布局，是网页UI设计师将有限的视觉元素进行有机的排列组合。当然不同的网站布局是不一样的，比如：百度，腾讯，淘宝，各自根据自己的需要来布局，网页设计的特点：可以设计成和网页百分比的自适应，网页的长度理论上可以无限的延长，它突破的传统的限制，一般的额网页布局：头部，主体以及底部。主体可以根据需要进行分栏，分栏又称为分列，常见的布局有：一列布局、二列布局以及三级布局。但是实际上我们用到的是混合布局，根据版式的需要进行混合。那么我们如果利用CSS的基本功能，比如：浮动，定位来完成UI设计图的布局。

一列布局一般适合比较简单的网页，值得注意的是，我们在用的时候得先清除默认的的样式，代码是body清除样式（可以使布局紧贴浏览器，没有空隙）body{margin:0;padding;0;还有一些值得注意的是margin:0 auto;是块状元素的居中对齐方式，text-align:center;是内联元素（如，a,img标签)的对齐方式padding:0;margin:0;是做为初始化页面，原因是页面在被各个浏览器读取时的理解不同产生不同的展示效果，所以需要清除.。

body{ margin:0; padding:0; font-size:30px}
div{ text-align:center; font-weight:bold}
.head, .main, .footer{ width:960px; margin:0 auto}
.head{ height:100px; background:#aba}
.main{ height:200px; background:#000}
.footer{ height:50px; background:#FCC}
}

我写的这样一个代码出来的是这样的页面

我们可以大概看出来一列布局大概的就出来的。

今天的学习基本就这样的一个图可以表示了，今天没有学太多，明天继续。