笔记

CSS的盒子模型

◇边框(border) 
上 border-top 
下 border-bottom 
左 border-left 
右 border-right

◇内补丁(Paddings)：内边距 
上 padding-top 
下 padding-bottom 
左 padding-left 
右 padding-right

◇外补丁(Margins)：外边距 
上 margin-top 
下 margin-bottom 
左 margin-left 
右 margin-right

边框(border)—这个元素内容的封闭图形的边界 
内补丁(Paddings)：内边距—自己这个元素边界距离自己内容文字的距离 
外补丁(Margins)：外边距—自己这个元素的边界距离另一个元素的边界（边框）的距离

☆CSS布局——漂浮

◇ float : none | left | right 
none :　默认值。对象不飘浮 
left :　文本流向对象的右边 
（本对象流向左边） 
right :　文本流向对象的左边 
（本对象流向右边）

◇ clear : none | left | right | both 
none :　 默认值。允许两边都可以有浮动对象 
left :　 不允许左边有浮动对象 
right :　 不允许右边有浮动对象 
both :　 不允许有浮动对象

（如果不允许浮动对象，且正好有一个对象漂浮过来，需要占这个对象一行位置，则这个对象移动，给那个漂浮过来的对象让出一行位置，让他们不会重叠）

☆CSS布局——定位 
◇ position : static | absolute | fixed | relative 
static :　 默认值。无特殊定位，对象遵循HTML定位规则。 
absolute : 将对象从文档流中拖出，使用 left ， right ， top ， bottom 等属性相对于其最接近的一个最有定位设置的父对象进行绝对定位。如果不存在这样的父对象，则依据 body 对象。而其层叠通过 z-index 属性定义。 
fixed :　 未支持。对象定位遵从绝对(absolute)方式。但是要遵守一些规范。 
relative :　对象不可层叠，但将依据 left ， right ， top ， bottom 等属性在正常文档流中偏移位置。

absolute —绝对定位。 
如果某个对象用了绝对定位，其实就相当于这个对象漂浮在另一个层面（重叠），而原来层面上自己占的位置被其他模块覆盖。

relative —相对定位。 
如果某个对象用了相对定位，也相当于这个对象漂浮在另一个层面（重叠），但是原来层面上自己占的位置不会被其他模块覆盖。

☆CSS布局——图文混排 
☆CSS布局——图像签名 
（这2个方式的实现其实就是用了盒子模型，绝对定位或相对定位来实现的）