浅谈css和div布局

要了解div和css，其实应该要了解什么是web前台，要了解前台其实想想我们用分层思 想做的机房收费系统UI层就好理解了。

UI层我们都知道面向用户的界面，只不过我们这里的web前台相当于动态网站而已

共同点都是面向用户界面，都是用来显示数据和收集数据。

不同点web前台比UI更具灵活性，更具扩展性（个人目前看法）。

 

为什么说web前台比UI更具灵活性，更具扩展性？

这里我们就要说到主体了：div和css布局。

因为web前台用的是div和css布局。

我们平时用的淘宝啊，新浪等门户的前台都是用的这样的布局。

 

要了解div和css布局，得了解是css盒子模型。

什么是CSS的盒子模式呢？为什么叫它是盒子？先说说我们在网页设计中常听的属性名：内容(content)、填充(padding)、边框(border)、边界(margin)， CSS盒子模式都具备这些属性。

我们日常生活中的盒子也具有这种属性，所以叫他盒子模型。当然你也可以叫其他的只要你能明白这种的意思就行，叫什么保温瓶啊模型等等。

打个比喻吧，当你上网抢到的小米手机到货时， 你里面的小米手机就是content。那个反震的汽泡沫就是padding ，border就是盒子本身。至于margin则说明盒子摆放的时候的不能全部堆在一起，要留一定空隙保持通风，同时也为了方便取出嘛。

 

转到web界面，其实整个web界面被划分成一块块的div。

div就是一个存放content的容器,而content就是文字和图片等内容。

理解了div， css好理解了。

打个比喻吧，div就像一块快砖头，css就像起房子的设计师。至于这房子被设计是别墅 还是摩天大楼，全看css了。

 

    Css负责界面架构，div就是填充这架构的一块块砖而已。

Css可以通过padding、border 、margin和div属性（id、class、title）等来改变div。但有点改变不了的，那就div容器里的content。

  css可以改变（大小，浮动等）div容器。但没法改变容器里的content。

这是本菜鸟的对css和div的一点看法，有什么硬伤，请各位帮忙纠正。