《CSS设计彻底研究》读书笔记 第04章 盒子的浮动与定位

1.CSS中有一个float属性，默认是none，也就是标准流通常的情况。如果将float属性的值设置为left或right，元素就会向其父元素的左侧或右侧靠紧，同时默认情况下，盒子的宽度不再伸展，而是根据盒子里面的内容的宽度来确定。

2.通过使用CSS布局，可以实现在HTML不做任何改动的情况下，调换盒子的显示位置。此外搜索引擎是不管CSS的，它只根据网页的价值来确定页面的排名，而对于一个HTML文档，越靠前的内容，搜索引擎会赋予越高的权重。

3.如果将几个盒子设置为浮动，然后将浏览器窗口变窄，当浏览器窗口无法在一行中所有的BOX时，写在HTML中最后面的BOX被挤到下一行，而不是最右边的盒子。 

4.clear属性的作用是为了消除浮动的盒子对其他盒子的影响              
          clear属性的取值可以为：left right和both
          对clear属性的设置要放到文字所在的盒子里，而不要放到对浮动盒子的设置里面

5.一个div的范围是由它里面的标准流内容决定的，与里面的浮动内容无关。      

6.定位的概念：     
     广义：泛指网页排版中的定位操作
     狭义：设置CSS中的position属性

 

--------------------------------------------------
author: cs_cjl
website: http://blog.csdn.net/cs_cjl
--------------------------------------------------

 

7.position可以设置为staitc、relative、absolute和fixed这四个值中的一个
             static：这是默认的属性值，也就是该盒子按照标准流（包括浮动方式）进行布局
             relative：称为相对定位，使盒子相对于它在原本的标准位置通过偏移指定的距离，到达新的位置。相对定位的盒子仍在标准流中，它对父块和兄弟盒子没有任何影响。
             absolute：绝对定位，盒子的位置以它的“最近”一个position属性被设置并且不是static的“祖先元素”为基准进行偏移。如果没有没有符合的祖先元素，那么会以浏览器窗口为基准进行定位。
             fixed：称为固定定位，它和绝对定位类似，只是以浏览器窗口为基准进行定位。
         
8.z-index属性用于调整定位时重叠块的上下位置，默认的z-index值为0，可以设置为正数或者负数。如果多个元素的z-index值相同，那么HTML标签中后出现的元素，会浮在先出现的元素之上。      

9. display属性可以取值为：          
          inline：行内
          block：块级
          none：无

          inline-block：它是行内的块级元素，它拥有块级元素的特点，可以设置长宽，可以设置margin和padding值，但它却不是独占一行，它的宽度并不占满父元素，而是和行内元素一样，可以和其他行内元素在同一行里。这个样式是CSS2.1添加的，IE6和IE7并不支持此样式，但是可以通过触发hasLayout来模拟
      通过设置display属性，可以改变某个标记本来的元素类型，或者把某个元素隐藏起来。